javascript - Start loading the second row after the second image on the first row has loaded -
what have second row of image start loading after second image on first has loaded. waits first row load 10 images, how trigger this?
this example url http://satbulsara.com/experiment-04/
and code
var delay = 200, t = 0; $("#rowone").children('li').css('display', 'none').each(function(){ t += delay; var $li = $(this); settimeout(function(){ $li.fadein(1900); },t); }); $("#rowtwo").children('li').css('display', 'none').each(function(){ t += delay; var $li = $(this); settimeout(function(){ $li.fadein(1900); },t); });
put t = delay * 2;
before code second row set initial delay it.
var delay = 200, t = 0; $("#rowone").children('li').css('display', 'none').each(function(){ t += delay; var $li = $(this); settimeout(function(){ $li.fadein(1900); },t); }); t = delay * 2; $("#rowtwo").children('li').css('display', 'none').each(function(){ t += delay; var $li = $(this); settimeout(function(){ $li.fadein(1900); },t); });
to make suitable multiple rows (also, don't repeat yourself):
var delay = 200, t = 0; $(".row").each(function() { $(this).children('li').css('display', 'none').each(function( { t += delay; var $li = $(this); settimeout(function(){ $li.fadein(1900); },t); }); t = delay * 2; });
and add class="row"
<ul>
elements.
Comments
Post a Comment