jquery判断滚动条距离顶部的距离方法
实例如下:
// 滑动滚动条
$(window).scroll(function(){
// 滚动条距离顶部的距离 大于 200px时
if($(window).scrollTop() >= 200){
$(".scroll_top").fadeIn(1000); // 开始淡入
} else{
$(".scroll_top").stop(true,true).fadeOut(1000); // 如果小于等于 200 淡出
}
});
以上这篇jquery判断滚动条距离顶部的距离方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
jQuery检测滚动条是否到达底部
一.jQuery检测浏览器window滚动条到达底部 jQuery获取位置和尺寸相关函数: $(document).height() 获取整个页面的高度 $(window).height() 获取当前也就是浏览器所能看到的页面的那部分的高度.这个大小在你缩放浏览器窗口大小时会改变,与document是不一样的 scrollTop() 获取匹配元素相对滚动条顶部的偏移. scrollLeft() 获取匹配元素相对滚动条左侧的偏移. scroll([[data],fn])
-
jQuery判断div随滚动条滚动到一定位置后停止
实现代码: 复制代码 代码如下: <script type="text/javascript">var rollSet = $('#widget'); var offset = rollSet.offset(); var fwidth = $("#footer").height(); $(window).scroll(function() { var scrollTop = $(window).scrollTop();
-
使用jQuery判断浏览器滚动条位置的方法
项目背景 webtouch(webapp)页面,防苹果手机safari浏览器,网上滑动,底部导航消失,滑动到底部又出现.向下滑动,底部导航出现. 遇到问题 1.我一开始用swipeup和swipedown来做,发现因为有滚动条,不会触发.因此只能判断滚动条是上滚下滚等.关于手机手势,后面的文章会介绍,欢迎关注! 2.通过上滚下滚来让底部导航显示或者因此,安卓上面的浏览器都可以,但是苹果safari会一闪一闪,原因是苹果safari自动有个弹跳效果,导致事件重复执行,解决办法是给上滚下滚一个距离,
-
jQuery判断是否存在滚动条的简单方法
利用jQuery控制滚动条滚动,再判断滚动条是否有偏移.如果有,则存在滚动条,相反没有滚动就不存在. <script type="text/javascript"> $(function(){ $("body").scrollTop(10);//控制滚动条下移10px if( $("body").scrollTop()>0 ){ alert("有滚动条"); }else{ alert("没有滚动条&
-
jQuery弹出层后禁用底部滚动条(移动端关闭回到原位置)
最近在忙于jquery的前端开发,学习到很多知识,今天小编给大家带来一段代码片段有关弹出层后禁用滚动条的代码. 具体代码如下所示: $("cli-open").click(function(){ var scrollTop = document.body.scrollTop;//保存点击前滚动条的位置 window.onscroll=function(){ document.body.scrollTop = scrollTop;//赋值给滚动条的位置 } }) $(".cli
-
浅析jquery如何判断滚动条滚到页面底部并执行事件
本文章向码农介绍jquery如何判断滚动条滚到页面底部并执行事件.首先理解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. 首先理解三个dom元素,分别是:clientHeight.offsetHeight.scrollTop. clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那个这个高度则是不包括滚动条没显示出来的下面部分的内容.而只是单纯的DIV的高度. offsetHeight:是指元素内容的高度.
-
一个用jquery写的判断div滚动条到底部的方法【推荐】
jQuery 里和滚动条有关的概念很多,但是有三个属性和滚动条的拖动有关,就是:scrollTop.scrollLeft.scrollHeight.其中 scrollHeight 属性,互联网上几乎搜素不到关于它的应用技巧,而我正好需要用到它. 我们现在只探讨和垂直滚动有关的 scrollTop.scrollHeight 属性. 一.滚动条有关属性的正确理解: 假设有以下Html代码: <div id="div1" style="overflow-y:auto; ove
-
jQuery实现判断滚动条到底部
判断滚动条到底部,需要用到DOM的三个属性值,即scrollTop.clientHeight.scrollHeight. scrollTop为滚动条在Y轴上的滚动距离. clientHeight为内容可视区域的高度. scrollHeight为内容可视区域的高度加上溢出(滚动)的距离. 从这个三个属性的介绍就可以看出来,滚动条到底部的条件即为scrollTop + clientHeight == scrollHeight. 废话不多少说,赶紧上代码(兼容不同的浏览器). lazyload.js
-
jquery 判断滚动条到达了底部和顶端的方法
复制代码 代码如下: $(document).height() //是获取整个页面的高度$(window).height() //是获取当前也就是浏览器所能看到的页面的那部分的高度.这个大小在你缩放浏览器窗口大小时会改变,与document是不一样的 要获取顶端,只需要获取到scrollTop()==0的时候就是顶端: 要获取底端,只要获取scrollTop()>=$(document).height()-$(window).height() 就可以知道已经滚动到底端了: 复制代码 代码如
-
jQuery实现判断滚动条滚动到document底部的方法分析
本文实例讲述了jQuery实现判断滚动条滚动到document底部的方法.分享给大家供大家参考,具体如下: 滚动条没有实际的高度.只是为了呈现效果才在外型上面有长度. 在js当中也没有提供滚动条的高度API. 参考了网上有关资料:判断滚动条到底部的基本逻辑是滚动条滚动的高度加上视口的高度,正好是document的高度,公式表示为 滚动条滚动的高度+浏览器视口的高度>=document的高度. 参考网上资料,具体代码如下: //滚动条在Y轴上的滚动距离 function getScrollTop(
随机推荐
- jQuery取得iframe中元素的常用方法详解
- window.onresize 多次触发的解决方法
- List调用toString()方法后,去除两头的中括号实例
- oracle删除主键查看主键约束及创建联合主键
- requireJS模块化实现返回顶部功能的方法详解
- bootstrap table表格插件使用详解
- Javascript 不能释放内存.
- js鼠标点击事件在各个浏览器中的写法及Event对象属性介绍
- 深入解析Android中View创建的全过程
- php + nginx项目中的权限详解
- linux下cat命令连接文件并打印到标准输出设备上
- JavaScript基于Ajax实现不刷新在网页上动态显示文件内容
- VBS教程:VBScript 基础-VBScript 数据类型
- oracle学习笔记(二)
- JS+CSS实现简易实用的滑动门菜单效果
- AS编程基础
- Nginx服务器搭建反向代理全攻略
- C#基础之泛型
- 深入理解二叉树的非递归遍历
- vue2实现可复用的轮播图carousel组件详解
