js保持div悬浮，不随页面向下滚动而被覆盖

最新推荐文章于 2019-11-25 16:00:54 发布

weixin_30608131

最新推荐文章于 2019-11-25 16:00:54 发布

阅读量127

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/imust2008/archive/2012/03/26/2417954.html

版权

<html>
<head>
<script type="text/javascript">
//兼容性1，document.body.scrollTop 和  document.documentElement.scrollTop 兼容性2. style.top的值firefox需要加“px” , ie兼容此px ,无需另外加判断  
     var stmnBASE = 840; //起始顶部间距（原始值）
     var stmnActivateSpeed = 1000; // 
     var stmnScrollSpeed = 10; //
     var stmnTimer;

     function RefreshStaticMenu() {
var top, stmnRefreshTimer;
         stmnRefreshTimer = stmnActivateSpeed;
         top = document.documentElement.scrollTop || (document.body ? document.body.scrollTop : 0);
         document.getElementById('STATICMENU').style.top = 1000 + "px";

//挪动到新位置
         if (top > stmnBASE)
             document.getElementById('STATICMENU').style.top = top + "px";
//恢复到原位置
         else
             document.getElementById('STATICMENU').style.top = stmnBASE + "px";

         stmnRefreshTimer = stmnScrollSpeed;
         stmnTimer = window.setTimeout( 'RefreshStaticMenu()', stmnRefreshTimer);
     }
     function InitializeStaticMenu() {

var topvalue = document.documentElement.scrollTop || (document.body?document.body.scrollTop:0);
var topFinalvalue = topvalue + stmnBASE;
         document.getElementById('STATICMENU').style.top = topFinalvalue + "px";
         RefreshStaticMenu();
     }
</script>
</head>
<body>
<div id="STATICMENU" class="right_nr news_right_nr"  style="border-style:none;POSITION: absolute; TOP: 840px; ">
                    <img alt="" src="/themes/Default/images/hotel/dl.png" />    
                    </div>
<script type="text/javascript">InitializeStaticMenu();</script>
</body>
</html>