随页面滚动显示/隐藏窗口固定位置元素_html/css_WEB-ITnose
程序员文章站
2022-04-22 22:22:02
...
0.效果
窗口固定位置显示元素,当页面高度大于某高度,并且页面向下滚动时,显示该元素;当页面位置小于某高度,或者页面向上滚动时,隐藏该元素。
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(); });});