Advanced Search

Return to Snippet

Revision: 56819
at April 16, 2012 20:20 by digitalclubb
Initial Code 
(function( $ ) {
    $.fn.unveil = function () {
        var images = this, loaded, inview;
        
        this.one("unveil", function(){
            this.setAttribute( "src", this.getAttribute( "data-src" ) );
            this.removeAttribute( "data-src" );
        });
        
        function unveil () {
            inview = images.filter(function(){
                var $e = $(this),
                    $w = $(window),
                    wt = $w.scrollTop(),
                    wb = wt + $w.height(),
                    et = $e.offset().top,
                    eb = et + $e.height();
                    
                return eb >= wt && et <= wb;
            });
            
            loaded = inview.trigger("unveil");
            images = images.not( loaded );
        }
        
        $(window).scroll(unveil);
        unveil();
        
        return this;
    };
})( jQuery );
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
Via @lmgalmeida

Usage:

data-src="image.jpg" src="loader.gif"

$("img").unveil();

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
unveil.js - a lightweight version of the \'lazy load\' plugin

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
image, plugin, jquery

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
JavaScript