Как определить прокрутку страницы до определенной точки в jQuery?

Ответ 1

Как насчет:

var target = $(".myPara").offset().top;
var interval = setInterval(function() {
    if ($(window).scrollTop() >= target) {
        alert("made it!");
        clearInterval(interval);
    }
}, 250);

Вот пример: http://jsfiddle.net/andrewwhitaker/24M3n/1/

У вас может возникнуть соблазн прикрепить обработчик события к событию прокрутки окна, но Джон Ресиг советует против него (Прокрутите вниз до "Лучший практика" ).

Обновление: Как указывает @AbdulJabbarWebBestow, может быть плохой идеей излишне запускать функцию каждые 250 мс. Здесь обновленный пример, который запускается только один раз, 250 мс после первого прокручивания пользователя:

var target = $(".mypara").offset().top,
    timeout = null;

$(window).scroll(function () {
    if (!timeout) {
        timeout = setTimeout(function () {
            console.log('scroll');            
            clearTimeout(timeout);
            timeout = null;
            if ($(window).scrollTop() >= target) {
                alert('made it');
            }
        }, 250);
    }
});

Пример: http://jsfiddle.net/24M3n/858/

Ответ 2

$(window).scroll(function(){
    console.log($('#myPara').offset().top < $(this).height() + $(this).scrollTop());
});

Ответ 3

Я думал о проблеме прикрепления события прокрутки (указано @AndrewWhitaker), и мои последние мысли заключаются в том, что нет необходимости добавлять обработчик событий scoll каждые x секунд, так как вы можете просто выполнить setInterval и проверить обратный вызов, должно ли отображаться предупреждение или нет. например:

var showMessageInterval = window.setInterval(showMessageIfNeeded, 500);
// you could adjust the interval to the animation duration of the 
// message showing. In this way, the delay will be more "natural"

Обратный вызов showMessageIfNeeded будет проверять значение scrollTop и показывать сообщение, если необходимо. Если сообщение отображается, setInterval необходимо удалить, чтобы избежать следующих действий:

function showMessageIfNeeded() {
    var scrollTop = $(window).scrollTop();
    var targetTop = $(".myPara").offset().top;
    if (scrollTop > targetTop) {
        alert('Show message');
        window.clearInterval(showMessageInterval);
    }
}