как добавить css в несколько divs в строке и один за другим с jquery

Question

Я добавляю css-фон в несколько divs, и я хочу сделать это в строке и один за другим. Теперь, когда я добавляю css ко всем divs, он добавляет все background-images ко всем divs сразу, что заставляет изображения загружаться медленно.

это мой JQuery код:

$('#m-portfolio .slick-slide').each(function(){ 
    var $item = $(this), 
     img  = $item.find('.m-p-view').attr('data-lazyload'), 
     bg  = $item.find('.m-p-view').attr('data-bg'); 

    $item.find('div.slice').css('background-image', 'url(' + img + ')'); 
    $item.find('.m-p-view').css('background-image', 'url(' + bg + ')');  
}); 

Answer 1

• демо: http://so.devilmaycode.it/how-to-add-css-to-multiple-divs-in-a-row-and-one-after-another-with-jquery/

$(function() { 
    $('#m-portfolio .slick-slide').each(function (i, item) { 
     var $item = $(this).hide(), 
      $mpview = $item.find('.m-p-view'), 
      $slice = $item.find('.slice'), 
      img = $mpview.attr('data-lazyload'), 
      bg = $mpview.attr('data-bg'); 
     $('<img src="' + img + '" />').load(function() { 
      $slice.css('background-image', 'url(' + img + ')'); 
      $('<img src="' + bg + '" />').load(function() { 
       $mpview.css('background-image', 'url(' + bg + ')').parent('.slick-slide').delay(i + '000').fadeIn(); 
      }); 
     }); 
    }); 
});