Babayiğit
Altın Üye
- Katılım
- 15 Ocak 2021
- Mesajlar
- 344
- Tepkime puanı
- 457
- İlgi Alanlarınız
- Yazılım
- Cinsiyet
-
- Erkek
hello admin system hacked hahahha işin şakası sonunda şifre hatırlandı
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CircleMenu3</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<link rel="icon" href="Yazılımcı Rehberi.png" type="image/png">
<style>
body {
background: #141719;
font-family: 'Montserrat', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
}
#stage {
position: relative;
height: 500px;
}
#circle-menu {
display: inline-block;
width: 100px;
height: 100px;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
#circle-menu .menu-trigger {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: #e74c3c;
color: #fff;
display: inline-block;
line-height: 100px;
text-align: center;
z-index: 9;
text-decoration: none;
font-size: 0.85rem;
font-weight: bold;
border: 3px solid transparent;
-webkit-border-radius: 50%;
-webkit-background-clip: padding-box;
-moz-border-radius: 50%;
-moz-background-clip: padding;
border-radius: 50%;
background-clip: padding-box;
transition: all 0.2s ease;
}
#circle-menu .menu-trigger:before,
#circle-menu .menu-trigger:after {
position: absolute;
left: 0;
width: 100%;
transition: all 0.2s ease;
}
#circle-menu .menu-trigger:before {
content: attr(data-open);
}
#circle-menu .menu-trigger:after {
content: attr(data-close);
zoom: 1;
filter: alpha(opacity=0);
-webkit-opacity: 0;
-moz-opacity: 0;
opacity: 0;
transform: translateY(15%);
}
#circle-menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#circle-menu ul li {
position: absolute;
width: 100px;
height: 100px;
display: inline-block;
-webkit-border-radius: 50%;
-webkit-background-clip: padding-box;
-moz-border-radius: 50%;
-moz-background-clip: padding;
border-radius: 50%;
background-clip: padding-box;
zoom: 1;
filter: alpha(opacity=0);
-webkit-opacity: 0;
-moz-opacity: 0;
opacity: 0;
transition: all 0.85s cubic-bezier(0, 1.8, 1, 1.2);
}
#circle-menu ul li:nth-child(1) {
background-color: #1abc9c;
}
#circle-menu ul li:nth-child(2) {
background-color: #3498db;
}
#circle-menu ul li:nth-child(3) {
background-color: #e67e22;
}
#circle-menu ul li:nth-child(4) {
background-color: #8e44ad;
}
#circle-menu ul li a {
color: #fff;
font-size: 1.5rem;
line-height: 100px;
display: block;
text-align: center;
}
#circle-menu.open .menu-trigger {
background: transparent;
border-color: #e74c3c;
}
#circle-menu.open .menu-trigger:before {
zoom: 1;
filter: alpha(opacity=0);
-webkit-opacity: 0;
-moz-opacity: 0;
opacity: 0;
transform: translateY(-15%);
}
#circle-menu.open .menu-trigger:after {
zoom: 1;
filter: alpha(opacity=100);
-webkit-opacity: 1;
-moz-opacity: 1;
opacity: 1;
transform: translateY(0px);
}
#circle-menu.open ul li {
zoom: 1;
filter: alpha(opacity=100);
-webkit-opacity: 1;
-moz-opacity: 1;
opacity: 1;
}
#circle-menu.open ul li:nth-child(1) {
transform: translateY(-120px);
}
#circle-menu.open ul li:nth-child(2) {
transform: translateX(120px);
}
#circle-menu.open ul li:nth-child(3) {
transform: translateY(120px);
}
#circle-menu.open ul li:nth-child(4) {
transform: translateX(-120px);
}
#circle-menu.open ul li:hover:nth-child(1) {
background-color: #28e1bd;
}
#circle-menu.open ul li:hover:nth-child(2) {
background-color: #5faee3;
}
#circle-menu.open ul li:hover:nth-child(3) {
background-color: #eb9950;
}
#circle-menu.open ul li:hover:nth-child(4) {
background-color: #a563c1;
}</style>
</head>
<body>
<div id="stage">
<div id="circle-menu">
<a class="menu-trigger" href="#" data-open="OPEN" data-close="CLOSE"></a>
<ul>
<li>
<a href="#"> <i class="fas fa-home"></i></a>
</li>
<li>
<a href="#"> <i class="fas fa-map-marker-alt"></i></a>
</li>
<li>
<a href="#"> <i class="fas fa-user"></i></a>
</li>
<li>
<a href="#"> <i class="fas fa-cogs"></i></a>
</li>
</ul>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script>
(function() {
$('.menu-trigger').on('click', function(e) {
e.preventDefault();
return $('#circle-menu').toggleClass('open');
});
}).call(this);</script>
</body>
</html>