The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other Difference between preloading images and lazy loading images Reply To: Difference between preloading images and lazy loading images


If you move the magnifier (on desktop) with the pen below, you’ll see that the new cursor is there immediately on mousedown. That’s because it’s preloaded (bottom of the script)… there would be a small period of “nothingness” in between until the second image is fetched otherwise.


var icons = ['touch.cur','touch.png','swipe.cur','swipe.png'];

$.each(icons, function() {$('#deposit').append('<img src="' + location + this + '" alt=""/>')});


I also intend to add a progress bar to the spinner on the site by the way. That’ll give any visitor a better idea of what to expect.

One of the other few pages I’ve made uses a primitive form of lazy loading I suddenly remembered…

function showNext() {

    $(window).bind('scroll', function(e) {

        if ($(window).scrollTop() > edge) {$('#image_02').show()}

        if ($(window).scrollTop() > edge+1250) {$('#image_03').show()}
        if ($(window).scrollTop() > edge+2500) {$('#image_04').show()}
        if ($(window).scrollTop() > edge+3750) {$('#image_05').show()}
        if ($(window).scrollTop() > edge+5000) {$('#image_06').show()}
        if ($(window).scrollTop() > edge+6250) {$('#image_07').show()}
        if ($(window).scrollTop() > edge+7500) {$('#image_08').show()}
        if ($(window).scrollTop() > edge+8750) {$('#image_09').show()}

        if ($(window).scrollTop() > edge+10000) {$('#image_10').show()}
        if ($(window).scrollTop() > edge+11250) {$('#image_11').show()}
        if ($(window).scrollTop() > edge+11500) {$('#image_12').show()}
        if ($(window).scrollTop() > edge+13750) {$('#image_13').show()}

Time for a rewrite on that one, I believe.