Skip to content

Instantly share code, notes, and snippets.

@scruffyfox
Created November 13, 2011 19:46
Show Gist options
  • Save scruffyfox/1362572 to your computer and use it in GitHub Desktop.
Save scruffyfox/1362572 to your computer and use it in GitHub Desktop.
JQuery Image Slider
//********************************************************************
//
// jQuery imageSlide created by Callum Taylor
// v 0.3
//
// Usage:
// $('div').imageSlide({timeout: 2000, children:"div", fadesSpeed:1000, loop: 2}, callback);
//
//********************************************************************
jQuery.fn.imageSlide = function(opt, callback)
{
$(this).each(function()
{
slide ($(this), opt, callback);
});
function slide (dom, opt, call)
{
var options = $.extend(
{
"timeout" : 2000,
"children" : "",
"fadeSpeed" : 1000,
"loop" : 0
}, opt);
var min_width = 0;
var min_height = 0;
$(dom).children(options.children).each(function()
{
var this_width = $(dom).outerWidth();
if (this_width > min_width) min_width = this_width;
var this_height = $(dom).outerHeight();
if (this_height > min_height) min_height = this_height;
});
$(dom).css("width", min_width);
$(dom).css("height", min_height);
var arr = $(dom).children(options.children).css("position", "absolute").hide();
if (arr.length < 2)
{
$(arr[0]).fadeIn(options.fadeSpeed);
return;
}
for (var i = 0; i < arr.length; i++)
{
$(arr[i]).css("z-index", i);
}
var count = 0;
var loopCounter = 0;
doSlide(arr, count);
function doSlide(array, count)
{
$(array[count]).fadeIn(options.fadeSpeed, function()
{
if (++count == array.length)
{
count = 0;
++loopCounter;
}
if (loopCounter == options.loop && loopCounter != 0)
{
call();
return;
}
else
{
$(this).animate({delay:1}, options.timeout, function()
{
$(this).fadeOut(options.fadeSpeed, doSlide(array, count));
});
}
});
}
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment