我无法通过交换班级来切换导航以更改边距。以console.log
元素而非按类定位是不好的做法? nav
可以上课吗?
我试图制作它,以便点击页面或链接,然后菜单关闭。
我更改了nav
,然后将该类交换为margin: 0 -250px 0 0;
这是我的剧本:
margin: 0 0 0 0;
我的HTML:
$('#menu-icon').click(function() {
$(this).toggleClass('nav');
$(this).toggleClass('navclick');
});
我的CSS:
<div class="minimenu">
<div class="minim" for="navigation">
<a class="far fa-user" href="#M"></a>
<i class="fas fa-bars" id="menu-icon"></i>
</div>
<nav>
<ul class="mobileT">
<li><a id="silentp1">Home</a></li>
<li><a id="silentp1-2">About Us</a></li>
<li><a id="silentp1-3">Our Team</a> </li>
<li><a id="silentp1-4">Contact Us</a></li>
<li><a id="silentp1-5">Sign Up</a></li>
<li><a href="#M">Login</a></li>
</ul>
</nav>
</div>
答案 0 :(得分:0)
我更喜欢使用函数addClass()或removeClass()。
标记<nav>
支持所有全局属性,例如class,id等。(请参阅https://www.w3schools.com/tags/tag_nav.asp)
例如:
.navclick{
position:fixed;
top:3.2em;
right:0;
width:250px;
height:80%;
margin:0 0 0 0;
-moz-transition:all 300ms cubic-bezier(0.77,0.2,0.05,1.0);
-webkit-transition:all 300ms cubic-bezier(0.77,0.2,0.05,1.0);
-o-transition:all 300ms cubic-bezier(0.77,0.2,0.05,1.0);
transition:all 300ms cubic-bezier(0.77,0.2,0.05,1.0);
}
和js
$('.menu-icon').click(function() {
if($("nav").hasClass('navclick')){
$("nav").removeClass('navclick')
}else{
$("nav").addClass('navclick')
}
});
OR
您可以使用边距更改jquery函数动画。见https://www.w3schools.com/jquery/jquery_animate.asp