HTML
xxxxxxxxxx1
<div class="main-app">2
<div class="btn-cont">3
<div class="main-btn">4
<div class="custom-menu-toggle openMenu"></div>5
</div>6
<div class="side-btns">7
<div class="side-btn">8
9
</div>10
</div>11
</div>12
</div>
CSS
xxxxxxxxxx background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.02) 50%, #a139f0 50%, #dc34f5 75%, #a139f0 100%);1
body {2
margin: 0;3
height: 100vh;4
position: relative;5
background-color: #0f101b;6
}7
8
.main-app {9
position: absolute;10
left: 0;11
right: 0;12
top: 0;13
bottom: 0;14
display: flex;15
align-items: center;16
justify-content: center;17
}18
19
.main-btn {20
position: relative;21
width: 6rem;22
height: 6rem;23
font-size: 2.5rem;24
display: flex;
JavaScript / jQuery
xxxxxxxxxx1
$(document).on('click', '.main-btn', function(e){2
$(this).toggleClass('active');3
$('.btn-cont').toggleClass('active');4
});
Comments (0)