当前位置:编程学习 > JS >>

jquery导航条悬浮停止(浏览器窗口)页面顶部 兼容ie6

css代码

 代码如下 复制代码

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


js代码

 代码如下 复制代码

<script type="text/javascript">
$(function(){

if ($.browser.msie && ($.browser.version == "6.0") && !$.support.style) {
var handler,sTop,dTop;
    dTop = $("#fixedNav").offset().top
    $(window).bind('scroll',function(){
        window.clearTimeout(handler);
        handler = window.setTimeout(function(){
            sTop = $(document).scrollTop();
            sTop > dTop ? $("#fixedNav").css("top",sTop - dTop) : $("#fixedNav").css("top",0);
     $("#fixedNav").css({"position":"relative","z-index":"1200"});
        },60);
    });
}else{

 var topMain= $("#fixedNav").offset().top
 $(window).scroll(function(){
  if ($(window).scrollTop()>topMain){
   $("#fixedNav").addClass("nav_scroll");
  }else{
   $("#fixedNav").removeClass("nav_scroll");
  }
 });

 }
});
</script>

html

 代码如下 复制代码

<div id=fixedNav>

<div class="mainMenu">
 <div class="greenMenu">
     <span class="greena">
        <a href="/">首页</a> |      
        <a href="http://www.zzzyk.com/sys/">服务器</a> |
        <a href="/school/">编程</a> |
        <a href="/seo/seo.html">搜索&seo</a> |
        <a href="/mon/mon.html">网站运营</a> |
        <a href="/fw/photo.html">ps教程</a> |
        <a href="/database/database.html">数据库</a> |
        <a href="/cssdiv/css.html">网页布局</a> |
        <a href="/js_a/js.html">js特效</a> |  
        <a href="/wy/yw.html">网页制作</a> |   
        <a href="/flash_a/flash.html">动画设计</a> |
       <a href="http://mb.zzzyk.com">网页模板</a> |
       <a href="http://code.zzzyk.com/"  >建站源码</a>
        </span>   
   </div>
</div>

补充:网页制作,jquery 
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,