个人中心
gpt4 book ai didi

javascript - 检查滚动条是否到达了带有jquery的div

转载 作者：太空宇宙 更新时间：2023-11-04 15:09:23 24 4
gpt4 key购买 nike

我正在尝试使用 jquery 检查何时从滚动条到达 div。我在 stackoverflow 上阅读了一些类似的问题，但所有问题都只在一个 div 上。我有 4 个 div，高度:100%，我想知道滚动条何时通过每个 div。我试过了，但只适用于第一个 div。

HTML:

<body>
<div id="main"></div>
<div id="service"></div>
<div id="clients"></div>
<div id="about"></div>
</body>

CSS:

body, html {
    height: 100%;
    padding: 0px;
    margin: 0px;
}
#main {
    background: red;
    height: 100%;
}
#service {
    background: green;
    height: 100%;
}
#clients {
    background: blue;
    height: 100%;
}
#about {
    background: yellow;
    height: 100%;
}

JS:

$(document).ready(function() {
    var passed_service = false;
    var passed_service = false;
    $('body,html').bind('scroll mousedown wheel DOMMouseScroll mousewheel keyup', function(event){
        if($(window).scrollTop() >= ($("#service").height())){
            if(!passed_service){
                alert("To #service");
                passed_service = true;
            }
        }
        if($(window).scrollTop() >= ($("#service").height() + $("#clients").height())){
            if(!passed_clients){
                alert("To #clients");
                passed_clients = true;
            }
        } 
    });
});

抱歉，这是我的一个愚蠢的错误，我无法删除问题:(

最佳答案 

var passed_service = false;
var passed_service = false; /* should be 'passed_clients' */

^ 这是你的问题

此外，不是将 div 的高度相加，而是使用顶部偏移量。

DEMO 

$(window).scrollTop() >= $("#service").offset().top
$(window).scrollTop() >= $("#clients").offset().top
...

关于javascript - 检查滚动条是否到达了带有jquery的div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21733617/

24 4 0
文章推荐： html - Angularjs 数据-ng-重复不起作用
文章推荐： C++ 整数类型 : special meaning for certain values
文章推荐： c++ - C++计算中的时间
文章推荐： java - 如何在 Hibernate/JPA 中实现 "optional"关系？
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com