测试元素在屏幕上可见的时间

Question

我想测试某个div是否在屏幕上可见。一旦可见，我就会喜欢它周围的div来改变背景颜色。

以下是我目前所拥有的内容：http://jsfiddle.net/4y9f2574/1/

if ($('.onscreen').isOnScreen()) {
    $('.box').css('background','green');
}

任何想法为什么当橙色框可见时蓝框不会变为绿色？

谢谢！劳伦

Answer 1

您只在加载页面时运行一次if语句。如果您希望在滚动窗口时运行它，您可以这样做：

$(window).scroll(function () {
    if ($('.onscreen').isOnScreen()) {
        $('.box').not('.onscreen').css('background','green');
    }
});

您还需要将onscreen添加到橙色框中。

<div class="box orange onscreen"></div>

选中此jsfiddle

Answer 2

你的小提琴onscreen中没有任何东西。你的意思是写.box吗？像：

if ($('.box').isOnScreen()) {
    $('.box').css('background-color','green');
}

Answer 3

没有类onscreen

的对象

这是你想要的吗？ http://jsfiddle.net/ez8vmbL7/1/