开发者

jQuery LazyLoad Alternative (minus the scrollbar code)

开发者 https://www.devze.com 2023-01-07 11:17 出处:网络
Hey, What I would like is to use the jQuery plugin: LazyLoad But, rather than trigger the event on Window Scroll - I would like to trigger it when the

Hey, What I would like is to use the jQuery plugin: LazyLoad

But, rather than trigger the event on Window Scroll - I would like to trigger it when the el开发者_运维知识库ements come into view.

(I have no scroll bars on my site, so scroll bars are not an option).

Help me before I have no hair left.

EDIT: Ok, so I got it to work - SORT OF - it only seems to work vertically and ONLY WITH THE OVERFLOW SHOWING! *


Your best bet is to set a timer and repeatedly check for image visibility. Or you can make the tracker function public method and then call it from the outside if something alters.

Change LazyLoad to something like this:

// ...
var elements = this;
if ("scroll" == settings.event) { // <-- you may want to remove conditional block
     var tracker = function(event) {  // <-- give it a name
        var counter = 0;
        elements.each(function() {
            if ($.abovethetop(this, settings) ||
                $.leftofbegin(this, settings)) {
                    /* Nothing. */
            } else if (!$.belowthefold(this, settings) &&
                !$.rightoffold(this, settings)) {
                    $(this).trigger("appear");
            } else {
                if (counter++ > settings.failurelimit) {
                    return false;
                }
            }
        });
        /* Remove image from array so it is not looped next time. */
        var temp = $.grep(elements, function(element) {
            return !element.loaded;
        });
        elements = $(temp);
    };

    (function repeat(){              
      tracker(); // <-- so you can use it here
      if (elements.length) 
        setTimeout(repeat, 100); // <-- check every 100ms
    })();
}
// ...
0

精彩评论

暂无评论...
验证码 换一张
取 消