playground
/
ResponsiveSlides.js
mirror of https://github.com/viljamis/ResponsiveSlides.js
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Adds option called "manualControls" which allows to write custom markup for pager navigation. "controls" option is renamed to "navContainer". Default speed of the transition is now to 500ms.

pull/126/head
Viljami Salminen 12 years ago
parent
f3713400b8
commit
97efefb693
2 changed files with 37 additions and 26 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 47
      responsiveslides.js
  2. 16
      responsiveslides.min.js

47
responsiveslides.js
Unescape View File

@ -1,4 +1,4 @@
/*! ResponsiveSlides.js v1.51 /*! ResponsiveSlides.js v1.52
* http://responsiveslides.com * http://responsiveslides.com
* http://viljamis.com * http://viljamis.com
* *
@ -14,7 +14,7 @@
// Default settings // Default settings
var settings = $.extend({ var settings = $.extend({
"auto": true, // Boolean: Animate automatically, true or false "auto": true, // Boolean: Animate automatically, true or false
"speed": 1000, // Integer: Speed of the transition, in milliseconds "speed": 500, // Integer: Speed of the transition, in milliseconds
"timeout": 4000, // Integer: Time between slide transitions, in milliseconds "timeout": 4000, // Integer: Time between slide transitions, in milliseconds
"pager": false, // Boolean: Show pager, true or false "pager": false, // Boolean: Show pager, true or false
"nav": false, // Boolean: Show navigation, true or false "nav": false, // Boolean: Show navigation, true or false
@ -24,7 +24,8 @@
"prevText": "Previous", // String: Text for the "previous" button "prevText": "Previous", // String: Text for the "previous" button
"nextText": "Next", // String: Text for the "next" button "nextText": "Next", // String: Text for the "next" button
"maxwidth": "", // Integer: Max-width of the slideshow, in pixels "maxwidth": "", // Integer: Max-width of the slideshow, in pixels
"controls": "", // Selector: Where controls should be appended to, default is after the <ul> "navContainer": "", // Selector: Where auto generated controls should be appended to, default is after the <ul>
"manualControls": "", // Selector: Declare custom pager navigation
"namespace": "rslides", // String: change the default namespace used "namespace": "rslides", // String: change the default namespace used
before: function () {}, // Function: Before callback before: function () {}, // Function: Before callback
after: function () {} // Function: After callback after: function () {} // Function: After callback
@ -38,7 +39,12 @@
var $this = $(this), var $this = $(this),
// Local variables // Local variables
vendor, selectTab, startCycle, restartCycle, rotate, $tabs, vendor,
selectTab,
startCycle,
restartCycle,
rotate,
$tabs,
// Helpers // Helpers
index = 0, index = 0,
@ -173,7 +179,7 @@
} }
// Pager // Pager
if (true === settings.pager) { if (settings.pager && !settings.manualControls) {
var tabMarkup = []; var tabMarkup = [];
$slide.each(function (i) { $slide.each(function (i) {
var n = i + 1; var n = i + 1;
@ -185,23 +191,28 @@
$pager.append(tabMarkup); $pager.append(tabMarkup);
// Inject pager // Inject pager
if (options.controls) { if (options.navContainer) {
$(settings.controls).append($pager); $(settings.navContainer).append($pager);
} else { } else {
$this.after($pager); $this.after($pager);
} }
} else if(settings.pager) { }
// If a selector has been given for the pager element
$pager = $(settings.pager); // Manual pager controls
if (settings.manualControls) {
$pager = $(settings.manualControls);
$pager.addClass(namespace + "_tabs " + namespaceIdx + "_tabs"); $pager.addClass(namespace + "_tabs " + namespaceIdx + "_tabs");
}
// Add pager slide class prefixes
if (settings.pager || settings.manualControls) {
$pager.find('li').each(function (i) { $pager.find('li').each(function (i) {
$(this).addClass( slideClassPrefix + (i + 1) ); $(this).addClass(slideClassPrefix + (i + 1));
}); });
} }
// If we have any pager, we need to set up the selectTab function // If we have a pager, we need to set up the selectTab function
if (settings.pager) { if (settings.pager || settings.manualControls) {
$tabs = $pager.find('a'); $tabs = $pager.find('a');
// Select pager item // Select pager item
@ -226,7 +237,7 @@
var idx = index + 1 < length ? index + 1 : 0; var idx = index + 1 < length ? index + 1 : 0;
// Remove active state and set new if pager is set // Remove active state and set new if pager is set
if (settings.pager) { if (settings.pager || settings.manualControls) {
selectTab(idx); selectTab(idx);
} }
@ -258,7 +269,7 @@
} }
// Pager click event handler // Pager click event handler
if (settings.pager) { if (settings.pager || settings.manualControls) {
$tabs.bind("click", function (e) { $tabs.bind("click", function (e) {
e.preventDefault(); e.preventDefault();
@ -301,8 +312,8 @@
"<a href='#' class='" + navClass + " next'>" + settings.nextText + "</a>"; "<a href='#' class='" + navClass + " next'>" + settings.nextText + "</a>";
// Inject navigation // Inject navigation
if (options.controls) { if (options.navContainer) {
$(settings.controls).append(navMarkup); $(settings.navContainer).append(navMarkup);
} else { } else {
$this.after(navMarkup); $this.after(navMarkup);
} }
@ -335,7 +346,7 @@
// Go to slide // Go to slide
slideTo($(this)[0] === $prev[0] ? prevIdx : nextIdx); slideTo($(this)[0] === $prev[0] ? prevIdx : nextIdx);
if (settings.pager) { if (settings.pager || settings.manualControls) {
selectTab($(this)[0] === $prev[0] ? prevIdx : nextIdx); selectTab($(this)[0] === $prev[0] ? prevIdx : nextIdx);
} }

16
responsiveslides.min.js vendored
Unescape View File

@ -1,8 +1,8 @@
/*! http://responsiveslides.com v1.51 by @viljamis */ /*! http://responsiveslides.com v1.52 by @viljamis */
(function(b,I,A){b.fn.responsiveSlides=function(k){var a=b.extend({auto:!0,speed:1E3,timeout:4E3,pager:!1,nav:!1,random:!1,pause:!1,pauseControls:!0,prevText:"Previous",nextText:"Next",maxwidth:"",controls:"",namespace:"rslides",before:function(){},after:function(){}},k);return this.each(function(){A++;var f=b(this),s,q,t,l,n,p,m=0,e=f.children(),B=e.size(),g=parseFloat(a.speed),C=parseFloat(a.timeout),u=parseFloat(a.maxwidth),d=a.namespace,j=d+A,D=d+"_nav "+j+"_nav",v=d+"_here",h=j+"_on",E=j+"_s", (function(b,I,B){b.fn.responsiveSlides=function(k){var a=b.extend({auto:!0,speed:500,timeout:4E3,pager:!1,nav:!1,random:!1,pause:!1,pauseControls:!0,prevText:"Previous",nextText:"Next",maxwidth:"",navContainer:"",manualControls:"",namespace:"rslides",before:function(){},after:function(){}},k);return this.each(function(){B++;var e=b(this),s,q,t,l,n,p,m=0,c=e.children(),C=c.size(),f=parseFloat(a.speed),D=parseFloat(a.timeout),u=parseFloat(a.maxwidth),d=a.namespace,g=d+B,E=d+"_nav "+g+"_nav",v=d+"_here",
r=b("<ul class='"+d+"_tabs "+j+"_tabs' />"),w={"float":"left",position:"relative",opacity:1,zIndex:2},x={"float":"none",position:"absolute",opacity:0,zIndex:1},F=function(){var c=(document.body||document.documentElement).style,a="transition";if("string"===typeof c[a])return!0;s=["Moz","Webkit","Khtml","O","ms"];var a=a.charAt(0).toUpperCase()+a.substr(1),b;for(b=0;b<s.length;b++)if("string"===typeof c[s[b]+a])return!0;return!1}(),y=function(c){a.before();F?(e.removeClass(h).css(x).eq(c).addClass(h).css(w), h=g+"_on",w=g+"_s",j=b("<ul class='"+d+"_tabs "+g+"_tabs' />"),x={"float":"left",position:"relative",opacity:1,zIndex:2},y={"float":"none",position:"absolute",opacity:0,zIndex:1},F=function(){var a=(document.body||document.documentElement).style,b="transition";if("string"===typeof a[b])return!0;s=["Moz","Webkit","Khtml","O","ms"];var b=b.charAt(0).toUpperCase()+b.substr(1),c;for(c=0;c<s.length;c++)if("string"===typeof a[s[c]+b])return!0;return!1}(),z=function(r){a.before();F?(c.removeClass(h).css(y).eq(r).addClass(h).css(x),
m=c,setTimeout(function(){a.after()},g)):e.stop().fadeOut(g,function(){b(this).removeClass(h).css(x).css("opacity",1)}).eq(c).fadeIn(g,function(){b(this).addClass(h).css(w);a.after();m=c})};a.random&&(e.sort(function(){return Math.round(Math.random())-0.5}),f.empty().append(e));e.each(function(a){this.id=E+a});f.addClass(d+" "+j);k&&k.maxwidth&&f.css("max-width",u);e.hide().css(x).eq(0).addClass(h).css(w).show();F&&e.show().css({"-webkit-transition":"opacity "+g+"ms ease-in-out","-moz-transition":"opacity "+ m=r,setTimeout(function(){a.after()},f)):c.stop().fadeOut(f,function(){b(this).removeClass(h).css(y).css("opacity",1)}).eq(r).fadeIn(f,function(){b(this).addClass(h).css(x);a.after();m=r})};a.random&&(c.sort(function(){return Math.round(Math.random())-0.5}),e.empty().append(c));c.each(function(a){this.id=w+a});e.addClass(d+" "+g);k&&k.maxwidth&&e.css("max-width",u);c.hide().css(y).eq(0).addClass(h).css(x).show();F&&c.show().css({"-webkit-transition":"opacity "+f+"ms ease-in-out","-moz-transition":"opacity "+
g+"ms ease-in-out","-o-transition":"opacity "+g+"ms ease-in-out",transition:"opacity "+g+"ms ease-in-out"});if(1<e.size()){if(C<g+100)return;if(a.pager){var z=[];e.each(function(a){a+=1;z+="<li><a href='#' class='"+E+a+"'>"+a+"</a></li>"});r.append(z);p=r.find("a");k.controls?b(a.controls).append(r):f.after(r);q=function(a){p.closest("li").removeClass(v).eq(a).addClass(v)}}a.auto&&(t=function(){n=setInterval(function(){e.stop(!0,!0);var b=m+1<B?m+1:0;a.pager&&q(b);y(b)},C)},t());l=function(){a.auto&& f+"ms ease-in-out","-o-transition":"opacity "+f+"ms ease-in-out",transition:"opacity "+f+"ms ease-in-out"});if(1<c.size()){if(D<f+100)return;if(a.pager&&!a.manualControls){var A=[];c.each(function(a){a+=1;A+="<li><a href='#' class='"+w+a+"'>"+a+"</a></li>"});j.append(A);k.navContainer?b(a.navContainer).append(j):e.after(j)}a.manualControls&&(j=b(a.manualControls),j.addClass(d+"_tabs "+g+"_tabs"));(a.pager||a.manualControls)&&j.find("li").each(function(a){b(this).addClass(w+(a+1))});if(a.pager||a.manualControls)p=
(clearInterval(n),t())};a.pause&&f.hover(function(){clearInterval(n)},function(){l()});a.pager&&(p.bind("click",function(c){c.preventDefault();a.pauseControls||l();c=p.index(this);m===c||b("."+h).queue("fx").length||(q(c),y(c))}).eq(0).closest("li").addClass(v),a.pauseControls&&p.hover(function(){clearInterval(n)},function(){l()}));if(a.nav){d="<a href='#' class='"+D+" prev'>"+a.prevText+"</a><a href='#' class='"+D+" next'>"+a.nextText+"</a>";k.controls?b(a.controls).append(d):f.after(d);var d=b("."+ j.find("a"),q=function(a){p.closest("li").removeClass(v).eq(a).addClass(v)};a.auto&&(t=function(){n=setInterval(function(){c.stop(!0,!0);var b=m+1<C?m+1:0;(a.pager||a.manualControls)&&q(b);z(b)},D)},t());l=function(){a.auto&&(clearInterval(n),t())};a.pause&&e.hover(function(){clearInterval(n)},function(){l()});if(a.pager||a.manualControls)p.bind("click",function(c){c.preventDefault();a.pauseControls||l();c=p.index(this);m===c||b("."+h).queue("fx").length||(q(c),z(c))}).eq(0).closest("li").addClass(v),
j+"_nav"),G=b("."+j+"_nav.prev");d.bind("click",function(c){c.preventDefault();if(!b("."+h).queue("fx").length){var d=e.index(b("."+h));c=d-1;d=d+1<B?m+1:0;y(b(this)[0]===G[0]?c:d);a.pager&&q(b(this)[0]===G[0]?c:d);a.pauseControls||l()}});a.pauseControls&&d.hover(function(){clearInterval(n)},function(){l()})}}if("undefined"===typeof document.body.style.maxWidth&&k.maxwidth){var H=function(){f.css("width","100%");f.width()>u&&f.css("width",u)};H();b(I).bind("resize",function(){H()})}})}})(jQuery,this, a.pauseControls&&p.hover(function(){clearInterval(n)},function(){l()});if(a.nav){d="<a href='#' class='"+E+" prev'>"+a.prevText+"</a><a href='#' class='"+E+" next'>"+a.nextText+"</a>";k.navContainer?b(a.navContainer).append(d):e.after(d);var d=b("."+g+"_nav"),G=b("."+g+"_nav.prev");d.bind("click",function(d){d.preventDefault();if(!b("."+h).queue("fx").length){var e=c.index(b("."+h));d=e-1;e=e+1<C?m+1:0;z(b(this)[0]===G[0]?d:e);if(a.pager||a.manualControls)q(b(this)[0]===G[0]?d:e);a.pauseControls||
0); l()}});a.pauseControls&&d.hover(function(){clearInterval(n)},function(){l()})}}if("undefined"===typeof document.body.style.maxWidth&&k.maxwidth){var H=function(){e.css("width","100%");e.width()>u&&e.css("width",u)};H();b(I).bind("resize",function(){H()})}})}})(jQuery,this,0);

Write Preview
Loading…
Cancel
Save