jQuery 怎么判断DIV出现在可视区域
直接上代码:
$(window).scroll(function () {
var oT = document.getElementById("myDiv").offsetTop;
if (oT >= $(window).scrollTop() && oT < ($(window).scrollTop() + $(window).height())) {
console.log("div出现在可视范围");
}
});
其中 .offsetTop 是原生写法,也可以用jQuery的写法 $(element).offset().Top()
此代码适用于 Html5网站往下滑动时 逐渐显示的 CSS3 animate 动画效果
jQuery 怎么判断DIV出现在可视区域的更多相关文章
- 如何判断元素是否在可视区域ViewPort
个性签名: 生如夏花,逝如冬雪:人生如此,何悔何怨. 前言: 经常需要计算元素的大小或者所在页面的位置,offsetWidth,clientWidth,scrollWidth,scrollTop这几个 ...
- 使用jQuery判断元素是否在可视区域
$("#app").offset().top; offset().top表示 绝对偏移值,比如说有一个很长的页面,#app这个元素 在最底下, $("#app" ...
- 如何判断一个Div是否在可视区域,判断div是否可见
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jq、js判断元素是否在可视区域内
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> ...
- jquery如何判断div是否隐藏--useful
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Vue-懒加载(判断元素是否在可视区域内)
上公式: 元素距离顶部高度(elOffsetTop) >= dom滚动高度(docScrollTop) 并且元素距离顶部高度(elOffsetTop) < (dom滚动高度 + 视窗高度) ...
- 如何判断元素是否在可视区域内--getBoundingClientRect
介绍 Element.getBoundingClientRect()方法返回元素的大小及其相对于视口的位置. 根据MDN文档 getBoundingClientRect 方法返回的是一个DOMRect ...
- JQuery判断div(控件)是否为隐藏
以下是JavaScript 中判断div是否为隐藏代码引用片段: if (div.style.display == "none") { div.style.display = &q ...
- Ztree插件,定位节点时(focus)不能进入可视区域BUG解决方案
相关插件版本: jquery.ztree.exedit-3.4.js jquery.ztree.all-3.4.js jquery-1.8.0.js function onAsyncSuccess(e ...
随机推荐
- CF#335 Sorting Railway Cars
Sorting Railway Cars time limit per test 2 seconds memory limit per test 256 megabytes input standar ...
- python 代码片段22
#coding=utf-8 class AddressBookEntry(object): version=0.1 def __init__(self, name,phone): self.name ...
- BZOJ 1831 & 就是一个DP....
题意: 比如说,4 2 1 3 3里面包含了5个逆序对:(4, 2), (4, 1), (4, 3), (4, 3), (2, 1). 可惜的是,由于年代久远,这些数字里有一部分已经模糊不清了,为了方 ...
- CSS抗锯齿 font-smoothing 属性介绍
CSS3里面加入了一个“-webkit-font-smoothing”属性. 这个属性可以使页面上的字体抗锯齿,使用后字体看起来会更清晰舒服. 加上之后就顿时感觉页面小清晰了. 淘宝也在用哦! 它有三 ...
- NOIP欢乐模拟赛 T2 解题报告
小澳的坐标系 (coordinate.cpp/c/pas) [题目描述] 小澳者表也,数学者景也,表动则景随矣. 小澳不喜欢数学,可数学却待小澳如初恋,小澳睡觉的时候也不放过. 小澳的梦境中出现了一个 ...
- 【wikioi】2822 爱在心中
题目链接 算法:Tarjan+dfs(最短路的都行,判连通而已) 先了解一下什么是Tarjan Tarjan算法用于求出图中所有的强连通分量. 转自NOCOW:点击打开链接 ============= ...
- BZOJ3456: 城市规划
Description 刚刚解决完电力网络的问题, 阿狸又被领导的任务给难住了. 刚才说过, 阿狸的国家有n个城市, 现在国家需要在某些城市对之间建立一些贸易路线, 使得整个国家的任意两个城市都直接或 ...
- SpringMVC视图机制详解[附带源码分析]
目录 前言 重要接口和类介绍 源码分析 编码自定义的ViewResolver 总结 参考资料 前言 SpringMVC是目前主流的Web MVC框架之一. 如果有同学对它不熟悉,那么请参考它的入门bl ...
- C语言(2)
C语言(2)---变量 基本格式: 变量类型 变量名1[,变量名2,变量名3,...变量名n]: 注意: 1.在C语言中如果申请一个变量,里面存放小数,则用float表示,且在输出时需要注意prin ...
- Enumerators and Enumerable
Next week task is to learn how generic enumeration interface works, try to build a sample and write ...