javascript - Javascript 的粘性侧边栏问题

标签 javascript css position

我正在尝试实现一个粘性侧边栏,当用户向下滚动页面时它始终位于窗口顶部。

我让它在正确的时间粘在顶部,但由于某种原因它不再向左浮动...有人可以告诉我我可以做些什么来让它在粘住时保持在相同的位置吗?

我的网站是here .提前致谢!

<script type="text/javascript">
$(function(){ // document ready

    if (!!$('.sticky').offset()) { // make sure ".sticky" element exists
        var stickyTop = $('.sticky').offset().top; // returns number 
        $(window).scroll(function(){ // scroll event
            var windowTop = $(window).scrollTop(); // returns number 
            if (stickyTop < windowTop){
                $('.sticky').css( { position:'fixed', top: 0, marginLeft: "30px" } );
            }
            else {
                $('.sticky').css('position','static');
            }
        });
    }

});
</script>

最佳答案

不要发明轮子。只需得到类似 this plug-in 的东西并享受。

关于javascript - Javascript 的粘性侧边栏问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11986502/

相关文章:

css - 使内部元素在溢出时右对齐

javascript - 将 Unix 时间戳转换为 API 中可读的时间

javascript - Vue FontAwesome 图标在计算时不会改变

javascript - 如何实现这个 sticky-header 向下滚动组件?

python - 如何从字符串中查找字符串中的字节位置,而不是字符位置?

javascript - 如何在 raphael.js 中定位与中心相关的对象

javascript - 使用 php 而不是 javascript 重定向页面

javascript - 如何呈现一个安全的、仅 HTTP 的 cookie 作为不记名 token (没有 Angular.JS)?

html - 使用 css/html 在悬停时更改图像

javascript - SVG 矩形未显示在 Firefox 中,但适用于 Chrome