html Crea unburgermenùanimato

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html Crea unburgermenùanimato相关的知识，希望对你有一定的参考价值。

body {background-color:#000}
#hamburger_menu {
    position: fixed;
    top: 23px;
    display: block;
    opacity: 1;
    right: 20px;
    z-index: 1200;
    width: 30px;
    height: 25px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}
#hamburger_menu span:nth-child(1) {
    top: 0px;
}
#hamburger_menu span:nth-child(2) {
    top: 10px;
}
#hamburger_menu span:nth-child(3) {
    top: 20px;
}
#hamburger_menu span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: #414141;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

#hamburger_menu.open span:nth-child(1) {
    top: 12px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
}
#hamburger_menu.open span:nth-child(2) {
    opacity: 0;
    left: -60px;
}
#hamburger_menu.open span:nth-child(3) {
    top: 12px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
}
$('#hamburger_menu').click(function(){
	$(this).toggleClass('open');
  return false;
});
<body>
<a id="hamburger_menu" href="#" class="">
   <span></span>
   <span></span>
   <span></span>
</a>
<script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
  crossorigin="anonymous"></script>
</body>

以上是关于html Crea unburgermenùanimato的主要内容，如果未能解决你的问题，请参考以下文章

如何在 h2 中找到时间戳超过 120 天的所有记录

sh Crea nuovo虚拟主机

css Crea联合菜单水平

Laravel 8 - 更改现有迁移

[Android] Android Error: Suspicious namespace and prefix combination [NamespaceTypo] when I try crea

Exception in thread "main" java.lang.NoSuchMethodError: scala.runtime.VolatileByteRef.crea