html Сендвичменюкнопка,превращаетсявкрестик
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html Сендвичменюкнопка,превращаетсявкрестик相关的知识,希望对你有一定的参考价值。
.mobile-menu-button {
display: block;
color: $color-green;
position: relative;
span {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: 250ms ease-in-out;
display: block;
opacity: 1;
width: 30px;
height: 3px;
background-color: $color-green;
}
span:nth-of-type(1) {
margin: -9px 0 0;
}
span:nth-of-type(3) {
margin: 9px 0 0;
}
&.active span:nth-of-type(1) {
transform: translate(-50%, -50%) rotate(45deg);
margin: 0;
}
&.active span:nth-of-type(2) {
opacity: 0;
}
&.active span:nth-of-type(3) {
transform: translate(-50%, -50%) rotate(-45deg);
margin: 0;
}
}
$('#mobile-menu-button').click(function() {
$(this).toggleClass('active');
});
<div id="mobile-menu-button" class="mobile-menu-button">
<span></span>
<span></span>
<span></span>
</div>
以上是关于html Сендвичменюкнопка,превращаетсявкрестик的主要内容,如果未能解决你的问题,请参考以下文章
python Естьдваспискаразнойдлины。 Впервомсодержатсяключи,авовторомзначения。 Напишитефункцию,котораясо
vbscript МакросдляOfficeудаляющийвселичныеданные(Инспектор)вовсехфайлахвыбраннойпапки。
html Включить/ВыключитьвыводчанканастраницевзависимостиотсодержимогоTV-параметра
swift Запроснаконсультацию。 ПоследовательноеполучениекартинокизPFFileдлямассиваобъектовPFObject
sh Редактироватьконфигвредакторепоумолчанию。 Еслинезаданпараметр--global,торедактируется.git / confi
php Подключениеклассов(модулей)вБитрикс