使用Jquery在Scroll上获取Element

时间:2016-05-25 12:19:15

标签: javascript jquery

当我滚动时,我一直试图获取Element。基本上我的目标是在滚动时获取元素

例如我有

<div id='ParentDiv' style="overflow-x:auto">
<div id="1" style="height:50px"> 1 <div>
<div id="2" style="height:100px">2</div> 
<div id="3" style="height:20px>3<div>
</div>

当我滚动到元素时,有什么办法可以获得Div的ID,因为ids是动态的

问候

2 个答案:

答案 0 :(得分:0)

我不知道这是不是你要找的东西:

$("div").on('mousewheel DOMMouseScroll', function(e) {
    var id = $(this).attr("id");
    console.log(id);
})

答案 1 :(得分:0)

您可以使用此代码。在#parent滚动,id屏幕中的元素,写在控制台中。

$("#parent").scroll(function() {
    var winHeight = $(this).height();
    var scrollTop = $(this).scrollTop();
    
    $(".child").each(function(index){ 
        var elemHeight = $(this).height();
        var elementTop = $(this).position().top; 

        if (elementTop < scrollTop + winHeight && scrollTop < elementTop + elemHeight)
           console.log($(this).attr("id"));       
    });
});
#parent {
    height: 150px;  
    overflow: auto;
} 

.child {
    height: 300px;
}

#child1 {
    background: red;
}

#child2 {
    background: blue;
}

#child3 {
    background: green;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="parent">
    <div id="child1" class="child"></div>
    <div id="child2" class="child"></div>
    <div id="child3" class="child"></div>
</div>