0

我正在构建一些代码以尝试在图像在视图中时发生某些事情,然后在图像不在视图中时重置计数器,如果图像返回查看,则再次发生相同的事情。

我有代码可以识别图像何时进入视野并执行某些操作,但是当我添加代码以在图像不在视野时重置计数器时,整个事情就停止了工作。

html:

<div style="height: 2000px">
<img  height="320px" width= "240px" id="pbr" src="http://i47.tinypic.com/33bztj8.jpg" alt="image 1">
<img height="320px" width= "240px" id="pbrglow" src="http://i48.tinypic.com/2ykduvl.jpg" alt="image 2">
<button id="button">click to reset</button>
</div>

CSS:

#pbr {
    position: absolute;   
    top: 500px;
    z-index: 0;
}
#pbrglow {
    position: absolute;             
    display: none;
    top: 500px;
    z-index: 1;

}
#button {
    position: absolute;
    top: 850px;
    z-index: 3;
}

javascript:

var y = $("#pbr").offset().top;
var eventsFired = 0;

$(window).scroll(function() {
    var y = $("#pbr").offset().top;
    var scrollY = $(window).scrollTop();
    if (scrollY + 100 > y && eventsFired == 0) {
        eventsFired++;
        alert(eventsFired);
    }
});


$("#button").on("click", function() {
    var scrollYY = $(window).offsetTop();
    if (eventsFired == 1) {
        alert("happened");
        eventsFired = 0;
    }
}

这是带有代码的jsfiddle

一旦我删除了以 $("#button")... 开头的代码,代码就可以工作了,但是代码中的这个却没有。

PS这是一个我需要在iOS上工作的网站。

4

1 回答 1

0

那是因为您的#button点击处理程序正在引发错误:

Uncaught TypeError: Object [object Object] has no method 'offsetTop'

如果您打开了控制台,您可以在 jsFiddle 页面上看到它(您可以通过 Settings->Safari->Developer 为移动 Safari 启用控制台)。

那个问题是$(window)没有offsetTop()方法。如果您摆脱了那条线(并且无论如何您都不需要它,因为您从未使用过scrollYY),那么一切正常。

于 2012-11-12T21:04:17.893 回答