A menu button Special effects case, simple to achieve the dynamic effect.
Nonsense not to say, directly to everyone paste code, code to write good, but also please give a lot of advice to heroes.
<div class= "Bar" id= "menubar" > <div class= "menu" id= "menu0" > </div> <div class= "menu" id= "menu1" &
Gt </div> <div class= "menu" id= "menu2" > </div> </div>. bar{width:px; height:px border:px Solid #cc
C
border-radius:%;
position:fixed;
TOP:PX;
RIGHT:PX;
Z-index:;
Cursor:pointer;
menu{width:px; height:px background-color: #ccc; position:absolute; transform:translated (-%,-%,); left:%; Transition:all. S cubic-bezier (.,.,.,.) s} #menu {top:%;} #menu {top:%;} #menu {top:%;} window.onload = function () {var menubar = document.getElementById ("menubar"); var menu = document.getElementById ("menu"); var menu = Document.getel
Ementbyid ("menu");
var menu = document.getElementById ("menu");
var i =; Menubar.onclick = function () {i++; if (i% = =) {Menu.style.top = + "%"; Menu.style.display = "none"; menu.style.top =
+ "%";
Menu.style.transform = "translated (-%,-%,) rotate (deg)";
Menu.style.transform = "translated (-%,-%,) rotate (deg)"; } else {menu.style.transform = "translated (-%,-%,) rotate (deg)"; menu.style.transform = "translated (-%,-%,) rotate (deg)";
Menu.style.top = + "%";
Menu.style.top = + "%";
Menu.style.display = "block"; }
}
}
The above code simple implementation of the Dynamic button menu effects, I hope to help you.