IrfanM
IrfanM

Reputation: 725

Prevent / Postpone loading of html elements

In developing my portfolio, I realised it takes a long-time for the page to load as all the images have to load in order for the page-load to be complete.

So, I was wondering if there is a way, any way, to prevent or stop the loading and then allow it later on.

Meaning something like, prevent the loading immediately and then on click of another element that had loaded, lets say #title, then load .images.

Is this possible and if so how?

Thanks in Advance!

Upvotes: 0

Views: 1552

Answers (1)

wanovak
wanovak

Reputation: 6127

Something like this:

HTML

<img src="" class="lazyload" data-attr="image1.jpg" alt="Alt" title="Title" width="50" height="50" />

Jquery

$('#title').click(function(){
    $('.lazyload').each(function(){
        $(this).attr('src',$(this).attr('data-attr'));
    });
});

Or you could use the LazyLoad plugin for slightly different functionality.

Upvotes: 3

Related Questions