一个网站 当访问者点了某个栏目以后 这个相应的栏目就变换一下他的样式 让他自己看起来与众不同,这样的话能够非常高的提高用户体验度 让用户在你的网站多停留那么些时间,最近发现一个新的利用js申明的方法来实现的 以下就是死路和具体的实现步骤。
1、先定义好一个CSS样式 例如:.navon{color:#ff0000;} /* 定义颜色为红色 */
2、给导航链接每一个不同的栏目定义不同的ID
<ul>
<li><a href="#" id="nav1">网站首页</a> </li>
<li><a href="#" id="nav2">关于我们</a> </li>
<li><a href="#" id="nav3">新闻列表</a> </li>
<li><a href="#" id="nav4">产品展示</a> </li>
<li><a href="#" id="nav5">联系我们</a> </li>
</ul>
3、在各自对应的栏目加上对应的JS代码 例如:
网站首页页面head之间加入
网站首页页面head之间加入
<script type="text/javascript">
$(function(){
$("#nav1").attr("class","navon");
});
</script>
联系我们head之间加入
联系我们head之间加入
<script type="text/javascript">
$(function(){
$("#nav5").attr("class","navon");
});
</script>
其他的以此类推...
实现的效果如图:
其他的以此类推...
实现的效果如图:
发表回复