直接上代码:

$(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出现在可视区域的更多相关文章

  1. 如何判断元素是否在可视区域ViewPort

    个性签名: 生如夏花,逝如冬雪:人生如此,何悔何怨. 前言: 经常需要计算元素的大小或者所在页面的位置,offsetWidth,clientWidth,scrollWidth,scrollTop这几个 ...

  2. 使用jQuery判断元素是否在可视区域

    $("#app").offset().top; offset().top表示 绝对偏移值,比如说有一个很长的页面,#app这个元素 在最底下,  $("#app" ...

  3. 如何判断一个Div是否在可视区域,判断div是否可见

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. jq、js判断元素是否在可视区域内

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> ...

  5. jquery如何判断div是否隐藏--useful

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. Vue-懒加载(判断元素是否在可视区域内)

    上公式: 元素距离顶部高度(elOffsetTop) >= dom滚动高度(docScrollTop) 并且元素距离顶部高度(elOffsetTop) < (dom滚动高度 + 视窗高度) ...

  7. 如何判断元素是否在可视区域内--getBoundingClientRect

    介绍 Element.getBoundingClientRect()方法返回元素的大小及其相对于视口的位置. 根据MDN文档 getBoundingClientRect 方法返回的是一个DOMRect ...

  8. JQuery判断div(控件)是否为隐藏

    以下是JavaScript 中判断div是否为隐藏代码引用片段: if (div.style.display == "none") { div.style.display = &q ...

  9. Ztree插件,定位节点时(focus)不能进入可视区域BUG解决方案

    相关插件版本: jquery.ztree.exedit-3.4.js jquery.ztree.all-3.4.js jquery-1.8.0.js function onAsyncSuccess(e ...

随机推荐

  1. 获取iframe的元素并进行操作

    获取iframe中的document元素有一下集中方法: 1.getElementById()方法和contentWindow属性: window.onload=function(){ /*必须等待页 ...

  2. EF框架step by step(2)—Model-First

    这一篇主要说一下EF框架中,Model First做法,仍然采用上一篇的案例.但增加评论功能.首先打开Blog.edmx文件,在空白处右键,添加新实体Comment,如下图示: 点击确定,关闭窗口. ...

  3. BZOJ 2733 & splay的合并

    题意: 带权联通块,添边与查询联通块中第k大. SOL: splay合并+并查集. 我以为splay可以用奇技淫巧来简单合并...调了一下午终于幡然醒悟...于是就只好一个一个慢慢插...什么启发式合 ...

  4. ACM spiral grid

    spiral grid 时间限制:2000 ms  |  内存限制:65535 KB 难度:4   描述 Xiaod has recently discovered the grid named &q ...

  5. URAL 1287. Mars Canals

    题目链接 这题挺水,看懂了,就OK.卡了几下内存,还是卡过了. #include <iostream> #include <cstdio> #include <cstri ...

  6. HDU 4433 locker(SPFA+DP)

    题目链接 去年区域赛的题目,早就看过题目了,又是过了好久了... 这题状态转移,一看就知道应该是 线性的那种,不过细节真的不好处理,一直没想出怎么搞,期间也看过题解,好像没太看懂... dp[i][j ...

  7. 【BZOJ1179】 [Apio2009]Atm tarjan缩点+SPFA

    Description Input 第一行包含两个整数N.M.N表示路口的个数,M表示道路条数.接下来M行,每行两个整数,这两个整数都在1到N之间,第i+1行的两个整数表示第i条道路的起点和终点的路口 ...

  8. 【noiOJ】P1996

    1996:登山 查看 提交 统计 提问 总时间限制:  5000ms 内存限制:  131072kB 描述 五一到了,PKU-ACM队组织大家去登山观光,队员们发现山上一个有N个景点,并且决定按照顺序 ...

  9. BZOJ3625: [Codeforces Round #250]小朋友和二叉树

    Description 我们的小朋友很喜欢计算机科学,而且尤其喜欢二叉树.考虑一个含有n个互异正整数的序列c[1],c[2],...,c[n].如果一棵带点权的有根二叉树满足其所有顶点的权值都在集合{ ...

  10. js 图片处理 Jcrop.js API

    引入jquery.Jcrop.min.css和jquery.Jcrop.min.js 参数/接口说明 options 参数说明 名称 默认值 说明 allowSelect true 允许新选框 all ...