jQuery

【jQuery】スクロールするときに画像をクロスフェードするcrossfade.js

June 25, 2017
crossfade.js

crossfade.jsはページを下にスクロールするときに画像をクロスフェードするための小さな(〜3kb)jQueryプラグイン。

how to use

$(function () {

  $('.crossfade').crossfade(options);

});

Options

  1. start
  2. end
  3. threshold
  4. backgroundPosition

example

$(function () {
		
	// Initialize both crossfade examples
	$('.js-example-1').crossfade({
		threshold: 0.2
	});

	$('.js-example-2').crossfade({
    start: 'demo/02.jpg',
    end: 'demo/02-blur.jpg',
		threshold: 0.5,
		backgroundPosition: 'center center'
	});

});

MIT