我为网站创建了一个具有 2 个功能的顶部菜单:
- 在滚动底部固定导航栏
- 滑动切换导航栏
这是演示:JSBIN
但是我有两个问题:
当页面位于顶部且菜单处于默认状态时,滑动切换效果很好
但是将页面滚动到底部并单击导航栏下的箭头后,滑动切换不起作用
菜单包含 2 个 div:
菜单:
<div id="menu" class="top-nav">
<ul>
<li class="active"><a href="#home" class="scroll">home page</a></li>
<li><a href="#about" class="scroll">home</a></li>
<li><a href="#events" class="scroll">m</a></li>
<li><a href="#home" class="scroll">dfsdfs</a></li>
</ul>
</div>
导航栏下箭头键和行的div:
<div id="menu-footer">
<div style="background:none repeat scroll 0 0 #CD1D27;padding:7px 0;"></div>
<div id="open-close-toggle" style="background:url(http://up.tractorfc.com/images/48714086549751927852.png) no-repeat;height:32px;background-position:center;"></div>
</div>
第二个问题在菜单页脚
我认为有更好的方法可以将此代码替换为具有箭头键并在菜单向上滑动时显示红线
我将这个脚本用于滑动菜单栏:
<script>
$("#open-close-toggle").click(function() {
$("#menu").slideToggle();
});
</script>
对不起英语不好
最佳答案
HTML 破坏了它。这是一个工作版本,可以切换页脚上的类以使其位于页面顶部。 http://jsbin.com/widaq/2/edit
关于jquery - 页脚菜单不会向上滑动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21739704/