如何判断一个Div是否可视区域,判断div是否可见
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>js</title>
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$(window).scroll(function () {
var a = document.getElementById("eq").offsetTop;
if (a >= $(window).scrollTop() && a < ($(window).scrollTop()+$(window).height())) {
alert("div在可视范围");
}
});
});
</script>
</head>
<body>
<div style="width:1px;height:2000px;"></div>
<div id="eq" style=" width:100px; height:100px; background-color:Red;">1</div>
<div style="width:1px;height:2000px;"></div>
</body>
</html>
如何判断一个Div是否可视区域,判断div是否可见的更多相关文章
- 如何判断元素是否在可视区域ViewPort
个性签名: 生如夏花,逝如冬雪:人生如此,何悔何怨. 前言: 经常需要计算元素的大小或者所在页面的位置,offsetWidth,clientWidth,scrollWidth,scrollTop这几个 ...
- 使用jQuery判断元素是否在可视区域
$("#app").offset().top; offset().top表示 绝对偏移值,比如说有一个很长的页面,#app这个元素 在最底下, $("#app" ...
- 在页面制作的时候常用的html页面滚动加载,可视区域判断方法
演示图 考虑2个情况一种情况初始状态下 滚动到在中间区域的时候,这时上半部分看不见的元素就不给字体添加红色一种情况是,从头向下看的. 代码 .ss li { margin: 40px; } <d ...
- 如何判断元素是否在可视区域内--getBoundingClientRect
介绍 Element.getBoundingClientRect()方法返回元素的大小及其相对于视口的位置. 根据MDN文档 getBoundingClientRect 方法返回的是一个DOMRect ...
- Vue-懒加载(判断元素是否在可视区域内)
上公式: 元素距离顶部高度(elOffsetTop) >= dom滚动高度(docScrollTop) 并且元素距离顶部高度(elOffsetTop) < (dom滚动高度 + 视窗高度) ...
- jq、js判断元素是否在可视区域内
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> ...
- GDI+如何判断一个点是否在区域内
https://msdn.microsoft.com/en-us/library/windows/desktop/ms533826(v=vs.85).aspx The purpose of hit t ...
- js 判断一个元素是否在滚动的可视区域内,不在就固定到可视区域的上方。
前言:最近工作中,有这样一个场景,判断一个元素是否在滚动的可视区域内,不在就固定到可视区域的上方.为了以后再次遇到,所以记录下来,并分享.转载请注明出处:https://www.cnblogs.com ...
- 【百度地图API】如何利用自己的数据制作社交地图?只显示可视区域内的标注
原文:[百度地图API]如何利用自己的数据制作社交地图?只显示可视区域内的标注 摘要:如果你自己的数据已经超过1万个,如何进行合理的显示?除了聚合marker外,还有一个办法.那就是,只显示可视区域内 ...
随机推荐
- Java反序列化漏洞通用利用分析
原文:http://blog.chaitin.com/2015-11-11_java_unserialize_rce/ 博主也是JAVA的,也研究安全,所以认为这个漏洞非常严重.长亭科技分析的非常细致 ...
- 用@RequestMapping映射请求
DispatcherServlet接受一个web请求之后,将请求发送给@Controller注解声明的不同控制器类. 这个调度过程依赖控制器类及其处理程序方法中声明的各种@RequestMapping ...
- windows c dll的创建与调用
DLL代码: // TestDynamic.cpp: implementation of the TestDynamic class. // ///////////////////////////// ...
- Metasploit中使用Nessus插件命令
基本命令 导入扫描结果 db_import /路径/文件.nessus 查看数据库里面现有的IP信息 msf > db_hosts -c address,svcs,vulns(注:vulns是 ...
- CUBRID学习笔记 40 使用net修改数据
修改 connection.Open(); string queryString = "UPDATE nation set capital = 'X' where `code` = ...
- poj 1265 Area (Pick定理+求面积)
链接:http://poj.org/problem?id=1265 Area Time Limit: 1000MS Memory Limit: 10000K Total Submissions: ...
- 使jQuqer更高效的方法
讨论 jQuery 和 javascript 性能的文章并不罕见.然而,本文我计划总结一些速度方面的技巧和我本人的一些建议,来提升你的 jQuery 和 javascript 代码.好的代码会带来速度 ...
- [转载] 为 Key-Value 数据库实现 MVCC 事务
http://mp.weixin.qq.com/s?__biz=MzA5ODM5MDU3MA==&mid=400086920&idx=1&sn=b8174184059e2886 ...
- Python学习(17)异常处理
目录 Python 异常处理 Python 标准异常 异常处理 使用except而不带任何异常类型 使用except而带多种异常类型 try-finally 语句 异常参数 异常的参数 用户自定义参数 ...
- mysql 查询执行的流程
1.客户端发送一个请求给服务器.2.服务器先检查查询缓存,命中了缓存,直接返回缓存中的数据,否则进入下一个阶段.3.服务器进行sql解析,预处理,再由优化器生成对应的执行计划.4.mysql根据执行计 ...