jquery吸頂

<!DOCTYPE html>

<html>

<head lang="en">

<meta charset="UTF-8">

<title>防騰訊固定導航欄</title>

<style type="text/css">

*{margin:0;padding:0;}

.main{

width: 1000px;

margin:0 auto;

/*margin-top: 20px;*/

}

</style>

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

 

</head>

<body>

    <div class="top">

     <img src="images/top.png"/>

    </div>

    <div class="nav">

     <img src="images/nav.png"/>

    </div>

    <div class="main">

     <img src="images/main.png"/>

    </div>

</body>

</html>

<script type="text/javascript">

     $(window).scroll(function(){

         //var tHeight =parseInt($(".top").css("height")) ;

         var tHeight =$(".top").height();

         var scrollTop = $(document).scrollTop();

         if(scrollTop>tHeight){

            $(".nav").css({"position":"fixed","top":0})

         }else{

            $(".nav").css({"position":"static"})    

         }

     })


 

</script>

 

 

 

 

寫的不好,還請多指教!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章