Question

我有一个类'container'的div，其中有许多div，类为'children'。我想在'children' div滚动到视图时对其进行操作。

我尝试过使用它。

$('.container .children').each(function(){
    var element = this;
    if(functionToCheckVisibility($(element))){
        //my code
    }
});

但它没有做出改变。

我怎样才能做到这一点？

Answer 1

尝试使用<div id="wrapper"> <div id="left"> One: <p> <button onclick="plus" id="6">plus</button> <p> <button onclick="minus" id="7">minus</button></div> <div id="right"> Two <p> <button onclick="plus2" id="6">plus</button> <p> <button onclick="minus2" id="7">minus</button></div> </div>：

$el.is(':visible')

如果“可见”是指“当前在屏幕上可见”，我会使用this library。否则，上面的代码应该可以正常工作。

Answer 2

尝试使用函数children

$('.container').children('children').each(function(){
    var element = this;
    if(functionToCheckVisibility($(element))){
        //my code
    }
});

Answer 3

这应该这样做：https://jsfiddle.net/0d8poebr/1/

$('.container .children').each(function(idx, el){
   if ($(el).is(':visible') && isScrolledIntoView(el)) {
        $(el).html('I am visible')
    }
});

function isScrolledIntoView(elem)
{
    var containerTop = $('.container').offset().top;
    var containerBottom = containerTop + $('.container').height();

    var elemTop = $(elem).offset().top;
    var elemBottom = elemTop + $(elem).height();

    return ((elemBottom <= containerBottom) && (elemTop >= containerTop));
}

单独检查div中所有元素的条件

3 个答案: