Jquery实现层div自动悬浮顶部实例

1、首先引用 jqeury库

<script src="css/jquery-1.6.2.min.js" type="text/javascript"></script>

2、其次在页面底部添加如下js

<script type="text/javascript">$(document).ready(function(){ var headHeight=200; //这个高度其实有更好的办法的。使用者根据自己的需要可以手工调整。var nav=$("#J_NavTag"); //要悬浮的容器的id$(window).scroll(function(){ if($(this).scrollTop()>headHeight){ nav.addClass("nav-fixed"); //悬浮的样式} else{ nav.removeClass("nav-fixed"); } }) })</script>

3、html代码示例

<p class="nav-tag clearfix" id="J_NavTag" > <a class="selected" target="_self" href=""><span>全部</span></a> <a target="_self" href=""><span>新品</span> <i></i></a> <a target="_self" href=""><span>明星</span> <i></i></a> <a target="_self" href=""><span>工艺</span> <i></i></a></p>

4、css样式

.nav-fixed { position: fixed; top: 0; left: 0; width: 100%; z-index: 99;}

,发光并非太阳的专利,我也可以发光 。

Jquery实现层div自动悬浮顶部实例

相关文章:

你感兴趣的文章:

标签云: