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 ページで確認できます ([設定] -> [Safari] -> [開発者] でモバイル Safari のコンソールを有効にすることができます)。

その問題は、メソッド$(window)がないことです。offsetTop()その行を取り除けば (そして、 を使用したことがないのでとにかく必要ありませんscrollYY)、すべてが機能します。

于 2012-11-12T21:04:17.893 に答える