New version of Lazyload?

Does anyone know of another plugin than Lazyload from Applesiini? http://www.appelsiini.net/projects/lazyload

They have stopped working on it, so it doesn't work in new browsers. I'm looking for an alternative.

What I nee开发者_C百科d it to do is simply not load images until the user has scrolled to it (but the code is already loaded, so no Ajax load new content). If you think it is easy to program I more than welcome any help.

Thanks.

I decided to give it a shot. Borrowed the in-viewport detection from the lazyload project and eventually got it working properly by using the rel attribute to specify the url to the images.

Had to use visiblity: hidden instead of display: none to be able to detect the position of the element, and then do hide, remove the visibility styling and animate with fadeIn.

You can animate it however you like by passing a function to the animate option.

Check out this test case on jsFiddle

You might want to check the plugin page again. It has been updated recently. Especially the demo page which uses scrollstop event. This event is not provided by default. Code is taken from James Padolseys excellent special scroll events for jQuery article.

Use this jQuery code to initiate an Ajax call when a page has scrolled past a particular element:

$("body").bind("scroll touchstart touchend",function(){
    if($("body").scrollTop()>=$("#something").offset().top){
        alert("Put an Ajax call here...");
    }
});

Simply replace #something with the jQuery selector of an element above the element you want to lazy load.

Ad@m