JS滚动板块固定显示

// 注释版
$(document).ready(function() {
    $(window).scroll(function() {
        // 获取元素相对于文档顶部的偏移量
        var contentOffset = $('.page-wrap-right').offset().top; 
        // 获取窗口当前滚动条的位置
        var scrollPosition = $(window).scrollTop(); 
        // 获取 banner 高度（包括外边距）
        var bannerHeightWithMargin = $('.page-banner').outerHeight(true); 

        // 获取文档总宽度
        var documentWidth = $(document).width();
        // 获取 .nyey 元素距离文档左边的距离
        var elementOffsetLeft = $('.nyey').offset().left;
        // 获取 .nyey 元素的宽度（包括内边距和边框）
        var elementWidth = $('.nyey').outerWidth();
        // 计算 .nyey 元素距离文档右边的距离
        var rightDistance = documentWidth - (elementOffsetLeft + elementWidth);

        console.log(rightDistance);

        // 设置固定定位样式
        var fixedStyles = {
            'position': 'fixed',
            'top': '50px',
            'width': '370px',
            'z-index': '1000',
            'right': rightDistance + 'px' // 将距离右边文档的距离应用到 right 样式
        };

        // 如果滚动位置大于 banner 高度
        if (scrollPosition >= bannerHeightWithMargin) {
            // 应用固定定位样式
            $('.nyey').css(fixedStyles);
        } else {
            // 否则应用绝对定位样式
            $('.nyey').css({
                'position': 'absolute',
                'right': '0px',
                'top': '0px',
            });
        }
    });
});


// 未注释版
 $(document).ready(function() {
    $(window).scroll(function() {
        var contentOffset = $('.page-wrap-right').offset().top; // 元素相对于文档顶部的偏移量
        var scrollPosition = $(window).scrollTop(); // 获取窗口当前滚动条的位置
        var bannerHeightWithMargin = $('.page-banner').outerHeight(true); // banner 高度

        var documentWidth = $(document).width();
        var elementOffsetLeft = $('.nyey').offset().left;
        var elementWidth = $('.nyey').outerWidth();
        var rightDistance = documentWidth - (elementOffsetLeft + elementWidth);

        console.log(rightDistance);

        var fixedStyles = {
            'position': 'fixed',
            'top': '50px',
            'width': '370px',
            'z-index': '1000',
            'right': rightDistance + 'px' // 直接应用距离右边文档的距离
        };

        if (scrollPosition >= bannerHeightWithMargin) {
            $('.nyey').css(fixedStyles);
        } else {
            $('.nyey').css({
                'position': 'absolute',
                'right': '0px',
                'top': '0px',
            });
        }
    });
});