Mootools公司-资产。图像

Posted 2021-02-26

This snippet assumes that you have a container `div` with an id of "images".

It also assumes that each img element inside your container div has the CSS property `visibility: hidden`

var loadImages = function(strSelector)
{
	var arrImages = $(strSelector).getElements('img');
	var arrSources = [];
	arrImages.each(function(eleImage) {
		arrSources.push(eleImage.get('src'));
	});
 
	new Asset.images(arrSources, {
		onComplete: function() {
			var objChain = new Chain;
			arrImages.each(function(eleImage) {
				objChain.chain(function() {
					eleImage.set('tween', {
						duration: 300
					}).tween('opacity', 0, 1);
					this.callChain.delay(100, this);
				});
			});
			objChain.callChain();
		}
	} );
}
 
window.addEvent(
  'domready',
  function()
  {
	loadImages( $('images') );
  }
);