(function ($) { $.fn.easySlider = function (options) { var defaults = { prevId: 'prevBtn', prevText: 'Previous', nextId: 'nextBtn', nextText: 'Next', controlsShow: true, controlsBefore: '', controlsAfter: '', controlsFade: true, firstId: 'firstBtn', firstText: 'First', firstShow: false, lastId: 'lastBtn', lastText: 'Last', lastShow: false, vertical: false, speed: 800, auto: false, pause: 2000, continuous: false, numeric: false, numericId: 'controls' }; var options = $.extend(defaults, options); this.each(function () { var obj = $(this); var s = $("li", obj).length; var w = $("li", obj).width(); var h = $("li", obj).height(); var clickable = true; obj.width(w); obj.height(h); obj.css("overflow", "hidden"); var ts = s - 1; var t = 0; $("ul", obj).css('width', s * w); if (options.continuous) { $("ul", obj).prepend($("ul li:last-child", obj).clone().css("margin-left", "-" + w + "px")); $("ul", obj).append($("ul li:nth-child(2)", obj).clone()); $("ul", obj).css('width', (s + 1) * w) }; if (!options.vertical) $("li", obj).css('float', 'left'); if (options.controlsShow) { var html = options.controlsBefore; if (options.numeric) { html += '<ol id="' + options.numericId + '"></ol>' } else { if (options.firstShow) html += '<span id="' + options.firstId + '"><a href=\"javascript:void(0);\">' + options.firstText + '</a></span>'; html += ' <span id="' + options.prevId + '"><a href=\"javascript:void(0);\">' + options.prevText + '</a></span>'; html += ' <span id="' + options.nextId + '"><a href=\"javascript:void(0);\">' + options.nextText + '</a></span>'; if (options.lastShow) html += ' <span id="' + options.lastId + '"><a href=\"javascript:void(0);\">' + options.lastText + '</a></span>' }; html += options.controlsAfter; $(obj).after(html) }; if (options.numeric) { for (var i = 0; i < s; i++) { $(document.createElement("li")).attr('id', options.numericId + (i + 1)).html('<a rel=' + i + ' href=\"javascript:void(0);\">' + (i + 1) + '</a>').appendTo($("#" + options.numericId)).click(function () { animate($("a", $(this)).attr('rel'), true) }) } } else { $("a", "#" + options.nextId).click(function () { animate("next", true) }); $("a", "#" + options.prevId).click(function () { animate("prev", true) }); $("a", "#" + options.firstId).click(function () { animate("first", true) }); $("a", "#" + options.lastId).click(function () { animate("last", true) }) }; function setCurrent(i) { i = parseInt(i) + 1; $("li", "#" + options.numericId).removeClass("current"); $("li#" + options.numericId + i).addClass("current") }; function adjust() { if (t > ts) t = 0; if (t < 0) t = ts; if (!options.vertical) { $("ul", obj).css("margin-left", (t * w * -1)) } else { $("ul", obj).css("margin-left", (t * h * -1)) } clickable = true; if (options.numeric) setCurrent(t) }; function animate(dir, clicked) { if (clickable) { clickable = false; var ot = t; switch (dir) { case "next": t = (ot >= ts) ? (options.continuous ? t + 1 : ts) : t + 1; break; case "prev": t = (t <= 0) ? (options.continuous ? t - 1 : 0) : t - 1; break; case "first": t = 0; break; case "last": t = ts; break; default: t = dir; break }; var diff = Math.abs(ot - t); var speed = diff * options.speed; if (!options.vertical) { p = (t * w * -1); $("ul", obj).animate({ marginLeft: p }, { queue: false, duration: speed, complete: adjust }) } else { p = (t * h * -1); $("ul", obj).animate({ marginTop: p }, { queue: false, duration: speed, complete: adjust }) }; if (!options.continuous && options.controlsFade) { if (t == ts) { $("a", "#" + options.nextId).hide(); $("a", "#" + options.lastId).hide() } else { $("a", "#" + options.nextId).show(); $("a", "#" + options.lastId).show() }; if (t == 0) { $("a", "#" + options.prevId).hide(); $("a", "#" + options.firstId).hide() } else { $("a", "#" + options.prevId).show(); $("a", "#" + options.firstId).show() } }; if (clicked) clearTimeout(timeout); if (options.auto && dir == "next" && !clicked) { ; timeout = setTimeout(function () { animate("next", false) }, diff * options.speed + options.pause) } } }; var timeout; if (options.auto) { ; timeout = setTimeout(function () { animate("next", false) }, options.pause) }; if (options.numeric) setCurrent(0); if (!options.continuous && options.controlsFade) { $("a", "#" + options.prevId).hide(); $("a", "#" + options.firstId).hide() } }) } })(jQuery);