判断指定对象是否进入浏览器可视窗口,true 进入,false 没进入
//判断指定对象是否进入浏览器可视窗口,true 进入,false 没进入
var $win = $(window);//jQuery 的 window 对象 即:文档对象
function isVisible($elem){
// console.log($win.height());//浏览器可视窗口的高度,也可以是任意DOM对象
// console.log($win.width());//浏览器可视窗口的高度,也可以是任意DOM对象 // console.log($win.scrollTop());//滚动条已经滚上去,隐藏起来的高度,即滚动条顶部距离浏览器顶部的距离 // console.log($elem.offset());//$elem对象距离文档可视窗口左边和顶部的距离,有两个值,left 和 top
// console.log($elem.offset().left);
// console.log($elem.offset().top); // console.log($elem.height());//任意DOM对象的宽高
// console.log($elem.width())//任意DOM对象的宽高 return ($win.height() + $win.scrollTop() > $elem.offset().top) && ($win.scrollTop() < $elem.offset().top + $elem.height);
} var $floor = $('.floor');
$floor.each(function(index,elem){
if (isVisible($(elem))) {
console.log('the ' + (index + 1) + 'floor is visible');
}
})
判断指定对象是否进入浏览器可视窗口,true 进入,false 没进入的更多相关文章
- JQuery 获取元素到浏览器可视窗口边缘的距离
获取元素到浏览器可视窗口边缘的距离 by:授客 QQ:1033553122 1. 测试环境 JQuery-3.2.1.min.js 下载地址: https://gitee.com/ishouke/ ...
- JavaScript中关于获取浏览器可视窗口的几个兼容性写法的理解
1.浏览器可视窗口的概述: 浏览器可视区域不是网页的body的大小.可视区指的是浏览器减去上面菜单栏.工具栏,下面状态栏和任务栏,右边滚动条(如果有的话)后的中间网页内容的单页面积大小.而body大小 ...
- vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示
vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示 https://cn.vuejs.org/v2/guide/class-and-sty ...
- jq获取浏览器可视窗口的高度
<script> var window_height = $(window).height(); </script>
- JQuery_处理元素和浏览器的窗口的尺寸
一.jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或 ...
- VC中判断指定窗口是否被其他窗口遮挡
本来是想判断当前窗口是否在最前面,无奈办法用尽就是不行,于是想换个思路:判断指定窗口是否被其他窗口遮挡.然后掘网三尺,找到了这个: bool CTestTray2Dlg::IsCoveredByOth ...
- 原生javasxript获取浏览器的滚动距离和可视窗口的高度
原生javasxript获取浏览器的滚动距离和可视窗口的高度 //封装兼容性方法获取滚动的距离 function getScrollOffset(){ if(window.pageXOffset){ ...
- Drools规则引擎-如果判断某个对象中的集合是否包含指定的值
规则引擎集合相关处理 在实际生产过程中,有很多关于集合的处理场景,比如一个Fact对象中包含有一个集合,而需要判断该集合是否包含某个值.而Drools规则引擎也提供了多种处理方式,比如通过from.c ...
- JavaScript BOM-11-BOM的核心-window对象; window对象的控制,弹出窗口方法; 超时调用; 间歇调用; location对象常用属性; 位置操作--location.reaplace,location.reload(); BOM中的history对象; Screen对象及其常用属性; Navigator对象;
JavaScript BOM 学习目标 1.掌握什么是BOM 2.掌握BOM的核心-window对象 3.掌握window对象的控制.弹出窗口方法 什么是bom BOM(browser object ...
随机推荐
- Go语言( 运算符)
运算符用于在程序运行时执行数学或逻辑运算. 运算符 Go 语言内置的运算符有: 算术运算符 关系运算符 逻辑运算符 位运算符 赋值运算符 算数运算符 运算符 描述 + 相加 - 相减 * 相乘 / 相 ...
- Android手机的分区以及一些刷机术语的了解
最早以前的手机基本都是下载一个刷机软件(像刷机精灵.刷机大师),一键root,一键刷机,这就以前的傻瓜式刷机,至少我在高中(2015年开始接触)的时候也是这么干的.那时候,好像有种手机开机界面会出现“ ...
- PXC增量恢复添加节点(IST)
绕开SST通过IST方式添加Node到Percona XtraDB Cluster Gcache存储了所有的 writeset ,因此说这个集合的大小直接决定了允许其他节点宕机后多长时间内可以进行 ...
- Java日志logback使用
pom中添加: <dependency> <groupId>org.slf4j</groupId> <artifactId>slf4j-api</ ...
- .NET子页Main页面实例(UI页面)
<%@ Page Language="C#" MasterPageFile="~/MasterPageDefault.master" AutoEve ...
- Python3 压缩与解压缩(zlib / gzip / bz2 / lzma / zipfile / tarfile)
本文由 Luzhuo 编写,转发请保留该信息. 原文: http://blog.csdn.net/Rozol/article/details/72672703 以下代码以Python3.6.1为例 L ...
- springmvc集成cxf的方法
最近需要在项目中增加webservice接口,供三方调用,下面就把集成的方法展示如下,供大家参考: 第一步:服务端的发布; 1:配置web.xml文件,添加cxf的servlet <servle ...
- DDL 操作数据库
DDL 操作数据库:常用的操作 CRUD 一.C(create)创建 1.创建数据库 create database 数据库名称; 2.创建数据库,判断是否存在,再创建(如果存在,就不再创建) cre ...
- C++线程同步之事件(生产者与消费者问题)
#include <windows.h> #include <stdio.h> HANDLE g_hSet = NULL; HANDLE g_hClear = NULL; HA ...
- Selenium文件上传
转自:https://www.cnblogs.com/miaojjblog/p/9679915.html Web上本地上传图片,弹出的框Selenium是无法识别的,也就是说,selenium本身没有 ...