jquery.nav.js活动部分高亮显示点击后停止工作
jquery.nav.js active section highlighted stop working after click
在制作一个单页网站时,我希望根据页面上的部分来突出显示菜单。我使用jquery.nav.js插件。
一切都按需工作,直到我点击其中一个菜单链接,然后在页面上移动时,菜单部分会停留在突出显示的链接上。
这里是网站:http://www.onepixelroom.com/londonrefurb/
脚本:
<script type="text/javascript" src="js/jquery.nav.min.js"></script>
<script>
$(document).ready(function() {
$('#nav').onePageNav();
});
</script>
导航html:
<ul id="nav">
<li><a href="#second" class="smoothScroll">about</a></li>
<li><span class="bar">|</span></li>
<li><a href="#fourth" class="smoothScroll">services</a></li>
<li><span class="bar">|</span></li>
<li><a href="#sixth" class="smoothScroll">portfolio</a></li>
<li><span class="bar">|</span></li>
<li><a href="#eight" class="smoothScroll">contact</a></li>
</ul>
和CSS:
#nav {
list-style-type: none;
height: 80px;
width: 325px;
margin: auto;
float: right;
position: relative;
top: 7px;
color: #5B5B5B;
}
/*
color:#49E2D6;
*/
#nav .current a {
color: #40E4F2;
}
#nav a:hover {
color:#40E4F2;
}
#nav li {
float: left;
}
#nav a {
text-transform: uppercase;
background-position: right;
padding-right: 10px;
padding-left: 10px;
display: block;
text-decoration: none;
font-family: 'Ubuntu', sans-serif;
font-size: 13px;
font-weight: 400;
}
如果有人需要这个,我通过向每个添加类".current"并添加到脚本来解决这个问题
JavaScript
<script>
$(document).ready(function(){
$('#nav').onePageNav({
currentClass: 'current',
scrollOffset: 0
});
});
</script>
HTML:
<ul id="nav">
<li><a href="#second" class="current">about</a></li>
<li><span class="bar">|</span></li>
<li><a href="#fourth" class="current">services</a></li>
<li><span class="bar">|</span></li>
<li><a href="#sixth" class="current">portfolio</a></li>
<li><span class="bar">|</span></li>
<li><a href="#eight" class="current">contact</a></li>
</ul>
如果我犯了错误,请纠正我。
相关文章:
- jQuery UI自动完成突然停止工作
- JavaScript打印功能使日历停止工作
- 下拉列表在使用z索引放置在前面后停止工作
- 由于响应中不存在“Access Control Allow Origin”标头,跨域请求停止工作
- 注入工厂时,Angular停止工作
- React Native DeviceEventEmitter键盘WillShow停止工作
- JavaScript在更改css时停止工作
- Chrome地理定位在更新后停止工作
- 重新启动jquery脚本后,角度停止工作
- twitter引导崩溃在第一次点击后停止工作
- 更新Wordpress和我的平滑滚动停止工作
- Hammer.js过了一段时间就停止工作了
- 应用程序在“关闭”之后停止工作(控制台中没有错误);咕哝的构造”;
- 当我添加JavaScript时,链接按钮停止工作
- NetBeans调试突然停止工作
- 某些Magento后端管理按钮已停止工作
- 表单验证在接近尾声时停止工作
- 为什么在ASP.NET Ajax更新面板中执行任何操作后javascript元素都停止工作
- jquery.nav.js活动部分高亮显示点击后停止工作
- 幻灯片停止工作控制台显示没有相关错误?但是这个无关