Tiny Crossfading Image / Background Slideshow Plugin - imgCrossfade

imgCrossfade v0.2 / 30-05-2016 #####A jQuery Plugin to easily crossfade through images (same dimensions required) Kevin Köllmann (Koelli91) licensed the GPL-3.0

#Usage

####Include:

<script src="js/imgCrossfade.min.js"></script>

####HTML: For "Standard" Images:

<div id="cycler"> 	<img src="one.jpg" class="cf" /> 	<img src="two.jpg" class="cf" /> 	... </div>

For Background-Images (the css background-image-property will be applied to the "cycler"):

<div id="cycler"> 	<img src="one.jpg" class="cf-bg" /> 	<img src="two.jpg" class="cf-bg" /> 	... </div>

The images itself will be completely hidden (display: none), so you don't have to worry about your layout.

####JS: For "Standard" Images:

$(document).ready(function() { 	$("#cycler").imgCrossfade(); });

For Background-Images:

$(document).ready(function() { 	$("#cycler").bgimgCrossfade(); });

####CSS: For both (standard and background-images):

#cycler { 	width: 227px; /* the common width of the images */ 	max-width: 100%; /* for responsiveness - choose whatever max-width you'd like */ }

####View in action: http://koelli91.github.io/imgCrossfade/

###Features:

	- Bootstrap-Compatible 	- Lightweight: ~2 KiB (minified) 	- Responsive 	- All browsers (incl. IE6) 

###Known Bugs:

	- background-image-transition currently only works in Webkit-Browsers (Chrome and Safari) 	(IE/Edge & FF just switch the background-image instantly after configured interval) 

###Options:

$("#cycler").imgCrossfade({ 	fading: 'fast'|'medium'|'slow'|<any number in ms> 	interval: <any number in ms> }); /* * fading: how long the crossfade should take (Default: 'medium' (= 1500 ms)) * interval: how often the image should change (Default: 7000 ms) */