Jquery实现文章页侧边栏随动滑动

做网站时很可能会用到文章页 sidebar 整个或某一个区块随着整个页面的滑动而固定在某个位置，以方便访客快捷操作。 那，这里就简单介绍一下使用 jquery 实现侧边栏随动。

代码语言：javascript复制

var navH = $("#category-ct").offset().top;
    $(window).scroll(function(){ //滚动条事件
        var scroH = $(this).scrollTop(); //获取要随动的元素的滑动距离
        //滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离，就固定
        if(scroH>=navH){
        $("#category-ct").css({position: 'fixed'});
        $("#category-ct").animate({top: '30px'},100);
    }
    else{
        $("#category-ct").css({position: 'static',top:'0px'});
    }
    });

jquery 网站 sidebar

0 人点赞