网页侧边栏随页面上下滚动动画

最新推荐文章于 2022-10-23 21:00:41 发布

原创最新推荐文章于 2022-10-23 21:00:41 发布 · 1.3k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#侧边栏 #页面滚动 #jquery

JavaScript 同时被 2 个专栏收录

9 篇文章

订阅专栏

jquery

7 篇文章

订阅专栏

本文介绍了一段用于实现网页侧边栏跟随滚动的动画效果的JavaScript代码。该动画能够确保元素始终可见，并随页面滚动而平滑移动。

给同事写的侧边栏滚动动画，后来又说不需要了，在这里做个笔记，省得到时候再让我加上。

    $(window).scroll(function(){
      if($("#date").offset().top - $(document).scrollTop() < 0){
           let pos = $(document).scrollTop()
           $("#date").stop().animate({top: pos+"px"}, "fast");
      }else if($(window).height()-[$("#date").offset().top - $(document).scrollTop()]-$("#date").height() < 0){
           let pos = $(document).scrollTop()
           $("#date").stop().animate({top: pos+"px"}, "fast");
       }
    }