利用JS实现随页面滚动显示/隐藏窗口固定位置元素

窗口固定位置显示元素，当页面高度大于某高度，并且页面向下滚动时，显示该元素；当页面位置小于某高度，或者页面向上滚动时，隐藏该元素，下面通过本文给大家介绍js实现随页面滚动显示/隐藏窗口固定位置元素，需要的朋友参考下吧

窗口固定位置显示元素，当页面高度大于某高度，并且页面向下滚动时，显示该元素；当页面位置小于某高度，或者页面向上滚动时，隐藏该元素。

先给大家展示下效果图：

1.html

已选: 0

登录后复制

2.css

p#selected-case-count{position:fixed; /*固定元素位置*/top:2px; /*距顶端举例*/right:40px; /*距右侧位置*/color:red; }

登录后复制

3.js

$(function() {$("#selected-case-count").hide();});var preTop=0;var currTop=0;$(function () {$(window).scroll(function(){currTop=$(window).scrollTop();if(currTop600){$("#selected-case-count").fadeIn(500);}else{$("#selected-case-count").fadeOut(500);}preTop=$(window).scrollTop();});});

登录后复制

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！

相关推荐：

使用Vue2如何实现三级联动

在JavaScript中如何使用单链表和循环链表

如何解决手机浏览器顶部下拉刷新的问题

以上就是利用JS实现随页面滚动显示/隐藏窗口固定位置元素的详细内容，更多请关注【创想鸟】其它相关文章！