1. //判断指定对象是否进入浏览器可视窗口,true 进入,false 没进入
  2. var $win = $(window);//jQuery 的 window 对象 即:文档对象
  3. function isVisible($elem){
  4. // console.log($win.height());//浏览器可视窗口的高度,也可以是任意DOM对象
  5. // console.log($win.width());//浏览器可视窗口的高度,也可以是任意DOM对象
  6.  
  7. // console.log($win.scrollTop());//滚动条已经滚上去,隐藏起来的高度,即滚动条顶部距离浏览器顶部的距离
  8.  
  9. // console.log($elem.offset());//$elem对象距离文档可视窗口左边和顶部的距离,有两个值,left 和 top
  10. // console.log($elem.offset().left);
  11. // console.log($elem.offset().top);
  12.  
  13. // console.log($elem.height());//任意DOM对象的宽高
  14. // console.log($elem.width())//任意DOM对象的宽高
  15.  
  16. return ($win.height() + $win.scrollTop() > $elem.offset().top) && ($win.scrollTop() < $elem.offset().top + $elem.height);
  17. }
  18.  
  19. var $floor = $('.floor');
  20. $floor.each(function(index,elem){
  21. if (isVisible($(elem))) {
  22. console.log('the ' + (index + 1) + 'floor is visible');
  23. }
  24. })

  

判断指定对象是否进入浏览器可视窗口,true 进入,false 没进入的更多相关文章

  1. JQuery 获取元素到浏览器可视窗口边缘的距离

    获取元素到浏览器可视窗口边缘的距离 by:授客 QQ:1033553122 1.   测试环境 JQuery-3.2.1.min.js 下载地址: https://gitee.com/ishouke/ ...

  2. JavaScript中关于获取浏览器可视窗口的几个兼容性写法的理解

    1.浏览器可视窗口的概述: 浏览器可视区域不是网页的body的大小.可视区指的是浏览器减去上面菜单栏.工具栏,下面状态栏和任务栏,右边滚动条(如果有的话)后的中间网页内容的单页面积大小.而body大小 ...

  3. vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示

    vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示 https://cn.vuejs.org/v2/guide/class-and-sty ...

  4. jq获取浏览器可视窗口的高度

    <script> var window_height = $(window).height(); </script>

  5. JQuery_处理元素和浏览器的窗口的尺寸

    一.jQuery width() 和 height() 方法 width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或 ...

  6. VC中判断指定窗口是否被其他窗口遮挡

    本来是想判断当前窗口是否在最前面,无奈办法用尽就是不行,于是想换个思路:判断指定窗口是否被其他窗口遮挡.然后掘网三尺,找到了这个: bool CTestTray2Dlg::IsCoveredByOth ...

  7. 原生javasxript获取浏览器的滚动距离和可视窗口的高度

    原生javasxript获取浏览器的滚动距离和可视窗口的高度 //封装兼容性方法获取滚动的距离 function getScrollOffset(){ if(window.pageXOffset){ ...

  8. Drools规则引擎-如果判断某个对象中的集合是否包含指定的值

    规则引擎集合相关处理 在实际生产过程中,有很多关于集合的处理场景,比如一个Fact对象中包含有一个集合,而需要判断该集合是否包含某个值.而Drools规则引擎也提供了多种处理方式,比如通过from.c ...

  9. 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 ...

随机推荐

  1. Linux系统下Dubbo安装的详细教程

    Linux系统下Dubbo安装的详细教程 1.Dubbo的简介 Dubbo是 [1]  阿里巴巴公司开源的一个高性能优秀的服务框架,使得应用可通过高性能的 RPC 实现服务的输出和输入功能,可以和 [ ...

  2. 缓存的设计及PHP实现LFU

    1. 恒定缓存性能有哪些因素? 命中率.缓存更新策略.缓存最大数据量. 命中率:指请求缓存次数和缓存返回正确结果次数的比例.比例越高,缓存的使用率越高,用来衡量缓存机智的好坏和效率.如果数据频繁更新, ...

  3. JAVA线程Disruptor核心链路应用(八)

    import java.util.concurrent.atomic.AtomicInteger; /** * Disruptor中的 Event * @author Alienware * */ p ...

  4. easyui-datagrid清空表中原有数据

    $('#dg').datagrid('loadData', { total: 0, rows: [] });

  5. Hive的五个基础介绍

    一.什么是Hive? 1.Hive是一个翻译器,SQL ---> Hive引擎 ---> MR程序 2.Hive是构建在HDFS上的一个数据仓库(Data Warehouse) Hive ...

  6. 整理:史上最简单的 MySQL 教程

    1 前言 数据库(Database)是按照数据结构来组织.存储和管理数据的仓库,它产生于距今六十多年前,随着信息技术和市场的发展,特别是二十世纪九十年代以后,数据管理不再仅仅是存储和管理数据,而转变成 ...

  7. Java xml出现错误 javax.xml.transform.TransformerException: java.lang.NullPointerException

    转自:https://www.jb51.net/article/98644.htm Java xml出现错误 javax.xml.transform.TransformerException: jav ...

  8. uavcan扩展帧格式 zubax

    zubax_gnss_1.0和zubax_gnss_2.0中使用的uavcan的两种不同封装方式.都是采用扩展帧29b帧类型 zubax_gnss_1.0 我的代码:https://github.co ...

  9. 我与SAP成都研究院吴院长的二三事

    这几天Jerry没怎么看手机,今天才注意到,昨天SAP中国研究院公众号上发布了一篇文章:SAP高管说: 体验经济时代下的SAP客户体验.仔细一看,这不是咱SAP成都研究院的吴院长么. 在今年没有发生部 ...

  10. IDEA中看Flink 1.9源码时报Sources not found for: org.apache.flink:flink-shaded-hadoop-2:2.4.1-7.0

    1.场景 在阅读Flink 1.9源码时,个别类如YarnClientImpl.java只能查看.class文件,想查看对应的.java source文件,点击Download source时,报So ...