JS实现随页面滚动显示/隐藏窗口固定位置元素
窗口固定位置显示元素,当页面高度大于某高度,并且页面向下滚动时,显示该元素;当页面位置小于某高度,或者页面向上滚动时,隐藏该元素。
先给大家展示下效果图:
1.html
<p id="selected-case-count"><span class='form-control'>已选: <span class="casecount">0</span></span></p>
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(currTop<preTop){ $("#selected-case-count").fadeOut(200); }elseif ($(window).scrollTop()>600){ $("#selected-case-count").fadeIn(500); }else{ $("#selected-case-count").fadeOut(500); } preTop=$(window).scrollTop(); }); });
以上所述是小编给大家分享的JS实现随页面滚动显示/隐藏窗口固定位置元素的相关知识,希望对大有所帮助!
理解javascript中Map代替循环
本文介绍了map给我们的js编程带来的好处及便利:1.Map能干什么map可以实现for循环的功能:!DOCTYPEhtmlhtmlheadlang="en"metacharset="UTF-8"title/title/headbodyscriptvararr=[
超实用的JavaScript表单代码段
整理了下比较实用的Javascript表单代码段,分享给大家供大家参考,具体内容如下1多个window.onload方法由于onload方法时在页面加载完成后,自动调用的。
js判断鼠标位置是否在某个div中的方法
本文实例讲述了js判断鼠标位置是否在某个div中的方法。分享给大家供大家参考,具体如下:div的onmouseout事件让div消失时,会出现这样的情况,就是当
编辑:广州明生医药有限公司
标签:位置,页面,元素,给大家,方法