页面模块随鼠标浮动在固定位置

admin 发布时间:2015-10-13 分类:Web 阅读:5558次 4 条评论

页面模块随鼠标浮动在固定位置。

页面滑动。当页面滑动到某位置,页面上的模块自动的浮在页面顶部或者底部。

具体实现方法有多种,第一种为position:absolute,当用户滑动滚轮时候不停地计算该模块具体顶部的top值。此种方法有点弊端是,页面元素太多时候给人有点延迟的感觉;

第二种,position:fixed。直接top:0px;

具体代码:

//浮动
var t = $(".J_tabNavBar .J_navBar").offset().top;
$(window).scroll(function () {
     var ct = $(this).scrollTop();
     if (parseInt(ct) >= t) {
           $(".J_tabNavBar .J_navBar").css({ "position": "fixed", "z-index": "9998", "top": "0px", "width": width + "px" });
      }
      else {
           $(".J_tabNavBar .J_navBar").attr("style", "");
       }
});


已有4条留言

发表评论:

◎欢迎您的参与讨论。