当HTML元素滚动到视图中时是否有JavaScript事件触发？ [英] Is there a Javascript event that triggers when an HTML element scrolls into view?

问题描述

我想在元素滚动到视图中加载元素，以减少服务器负载。缩略图，但是希望在页面加载时存在它们的占位符 divs 。为了做到这一点，我认为当 div 变得可见时，我需要一种触发器。

I want to load elements as they scroll into view to reduce server load e.g. thumbnails, but would like their placeholder divs to exist from when the page loads. To do this, I think I need a trigger of some kind when the div becomes visible.

jquery-appear 被建议，但似乎无法从任何地方获取副本（Google给我一个403错误）

jquery-appear was suggested but I cannot seem to get a copy of it from anywhere (Google gives me a 403 error)

有没有人知道如何做到这一点？

Does anyone know how else to do this?

推荐答案

我认为jQuery的方式是你可能需要的插件：

I think jQuery way points is the plugin you might need:

http://imakewebthings.com/jquery-waypoints/

以下是如何调用航点插件：

Below is how you can call a waypoint plugin:

$(document).ready(function() {
    var $loading = $("<div class='loading'><p>Loading more items&hellip;</p></div>"),
    $footer = $('footer'),
    opts = {
        offset: '100%'
    };

    $footer.waypoint(function(event, direction) {
        $footer.waypoint('remove');
        $('body').append($loading);
        $.get($('.more a').attr('href'), function(data) {
            var $data = $(data);
            $('#container').append($data.find('.article'));
            $loading.detach();
            $('.more').replaceWith($data.find('.more'));
            $footer.waypoint(opts);
        });
    }, opts);
});

这篇关于当HTML元素滚动到视图中时是否有JavaScript事件触发？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！