Skip to content

Instantly share code, notes, and snippets.

Created June 20, 2011 12:21
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save remvee/1035525 to your computer and use it in GitHub Desktop.
Very basic slide show using jquery.
Simple continuous slide show using JQuery.
<div id="slides">
<div class="slide">First</div>
<div class="slide">Second</div>
<div class="slide">Third</div>
<script type="application/javascript">$("#slides").slide({delay: 5000});</script>
Copyright (c) 2011 - R.W. van 't Veer
(function ($) {
$.fn.slide = function(options) {
var options = $.extend({delay: 2000}, options);
return this.each(function () {
var container = $(this).css({
position: "relative"
var slides = $(this).find(".slide").css({
position: "absolute"
var slider = function() {
var current = $(this), next = $(this).next(".slide");
if (next.size() == 0) {
next = $(this).parent().children(".slide").first();
setTimeout(function() {
current.css({zIndex: 2}).show();
next.css({zIndex: 1}).show().animate({},
{complete: slider},
}, options.delay);
slides.first().animate({}, {complete: slider}, options.delay);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment