JSFiddle - React, Tailwind, and code Playground

by neal_fletcher

JavaScript

$(window).load(function () {
	    setTimeout(function () {
	        $('.products-grid-block').imageloader({
	            background: true,
	            callback: function (elm) {
	                $(elm).fadeIn('slow');
	            }
	        });
	    }, 1000);
	});






	$(window).load(function () {
	    setTimeout(function () {
	        $('.products-grid-block').each(function (index) {
		        $(this).imageloader({
		            background: true,
		            callback: function (elm) {
		                $('.products-grid-block').slice(0, 50).delay(50).fadeIn(300);
	            		$('.products-grid-block').slice(50, 100).delay(550).fadeIn(300);
	            		$('.products-grid-block').slice(100, 150).delay(1050).fadeIn(300);
	            		$('.products-grid-block').slice(150, 200).delay(1550).fadeIn(300);
	            		$('.products-grid-block').slice(200, 250).delay(2050).fadeIn(300);
	            		$('.products-grid-block').slice(250, 300).delay(2550).fadeIn(300);
	            		$('.products-grid-block').slice(300, 350).delay(3050).fadeIn(300);
	            		$('.products-grid-block').slice(350, 400).delay(3550).fadeIn(300);
	            		$('.products-grid-block').slice(400, 450).delay(4050).fadeIn(300);
	            		$('.products-grid-block').slice(450, 500).delay(4550).fadeIn(300);
	            		$('.products-grid-block').slice(500, 550).delay(5050).fadeIn(300);
	            		$('.products-grid-block').slice(550, 600).delay(5550).fadeIn(300);
	            		$('.products-grid-block').slice(600, 650).delay(6050).fadeIn(300);
		            }
		        });
	        });
	    }, 1000);
	});