Saya sedang bekerja untuk memberi gaya pada menu saya, saya benar-benar sesuatu yang baru dalam hal ini. Yang saya coba lakukan adalah ketika menu saya muncul, ia akan melihat transisi dari kiri ke kanan, ketika disembunyikan dari itu akan ...

css
1
Inphyy 6 April 2021, 01:52

1 menjawab

Jawaban Terbaik
var header = document.getElementById('menu-header');
var button = document.getElementById('button');
button.addEventListener('click', function(){
    header.classList.toggle('show');
});
@media (max-width: 828px) {
  #menu-header {
    display: block;
    position: fixed;
    z-index: 1;
    background-color: #FFF;
    left: 0;
    top: 0;
    height: 100%;
    width: 40%;
    padding: 20px 20px;
    transform: translateX(-100%);
    transition: transform 350ms ease;
    background: #c33;
  }
  
  #menu-header.show {
    transform: translateX(0);
  }
}

#button {
  position: fixed;
  right: 0;
  top: 0;
}
<div id="menu-header">
  MENU
</div>

<button id="button">
  Click me
</button>
0
user3212461 5 April 2021, 23:08