SHARE
TWEET

Auto-slide Twenty Eleven Featured Posts Slider v3.1

RavanH May 29th, 2012 89,382 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*<script type="text/javascript" charset="utf-8">*/
  2. /* * *
  3.  * Auto-slide the Twenty Eleven Featured Posts Slider v3.1
  4.  * with pause on mouse hover over featured content and
  5.  * slide precursor button blinking.
  6.  * By RavanH -- http://4visions.nl/?p=1001 --
  7.  * Special thanks to Tim Down's setTimeout wrapper script
  8.  * http://stackoverflow.com/a/3969760/573224
  9.  *
  10.  * Paste code in a text widget in the Showcase Sidebar.
  11.  * Adapt variables 'slide_speed' and 'slide_delay' to change
  12.  * the slider effect and timeout speed in milliseconds.
  13.  * The variable 'slide_delay_first' is meant for the first
  14.  * timeout during which page elements like images are still
  15.  * loading which usually needs some extra time while
  16.  * slide_effect and slide_easing control more advanced slider
  17.  * behaviour. Change slide_precursor_time/speed to control
  18.  * blinking of the upcoming slide dot (button).
  19.  * Read the instructions next to the available options.
  20.  */
  21. (function($) {
  22.   /* change these settings to your liking */
  23.   var slide_delay = 5000; /* timeouts in ms */
  24.   var slide_delay_first = 6000; /* first timeout in ms */
  25.   var slide_effect = 'slide'; /* available options are 'slide', 'fade' or '' (default) */
  26.   var slide_easing = 'swing'; /* available options are  'linear' or 'swing' */
  27.   var slide_speed = 300; /* slide effect speed in ms */
  28.   var slide_precursor_time = 1250 ; /* precursor blinking time in ms (0 is OFF) */
  29.   var slide_precursor_speed = 300; /* precursor blink speed in ms */
  30.  
  31.   /* do not edit below here, unless you know what you're doing */
  32.   var slide_precursor_timer = new Timer(function(){slide_preCursor($('nav.feature-slider a.active').parent().next().children().first());},slide_delay_first-slide_precursor_time);
  33.   var slide_timer = new Timer(function(){slide_goOut($('section.featured-post').filter(':visible'),$('nav.feature-slider a.active').parent().next().children().first());},slide_delay_first);
  34.  
  35.   $('section.featured-post').hover(function(){slide_precursor_timer.pause();slide_timer.pause();},function(){slide_precursor_timer.resume();slide_timer.resume();}).slice(1).css('display','none');
  36.  
  37.   $('.feature-slider a').click(function() {
  38.     slide_precursor_timer.clear();
  39.     slide_timer.clear();
  40.     var obj = $(this.hash);
  41.     obj.css('opacity',1);
  42.     var next_link = $(this).parent().next().children().first();
  43.     if (next_link.length == 0) {
  44.       next_link = $('nav.feature-slider a').first();
  45.     }
  46.     if (slide_effect == 'slide') {
  47.       obj.slideDown(slide_speed, slide_easing, function(){slide_precursor_timer.clear();slide_precursor_timer = new Timer(function(){slide_preCursor(next_link);},slide_delay-slide_precursor_time);slide_timer = new Timer(function(){slide_goOut(obj,next_link);},slide_delay);} );
  48.     } else if (slide_effect == 'fade') {
  49.        obj.fadeIn(slide_speed, slide_easing, function(){slide_precursor_timer.clear();slide_precursor_timer = new Timer(function(){slide_preCursor(next_link);},slide_delay-slide_precursor_time);slide_timer = new Timer(function(){slide_goOut(obj,next_link);},slide_delay);} );
  50.     } else {
  51.       obj.show(slide_speed, slide_easing, function(){slide_precursor_timer.clear();slide_precursor_timer = new Timer(function(){slide_preCursor(next_link);},slide_delay-slide_precursor_time);slide_timer = new Timer(function(){slide_goOut(obj,next_link);},slide_delay);} );
  52.     }
  53.   });
  54.  
  55.   function slide_goOut(obj,link) {
  56.     slide_precursor_timer.clear();
  57.     if (link.length !== 0) {
  58.       if (slide_effect == 'slide') {
  59.         obj.slideUp(slide_speed, slide_easing, function(){link.trigger('click');});
  60.       } else if (slide_effect == 'fade') {
  61.         obj.fadeOut(slide_speed, slide_easing, function(){link.trigger('click');});
  62.       } else {
  63.         obj.hide(slide_speed, slide_easing, function(){link.trigger('click');});
  64.       }
  65.     }
  66.   }
  67.  
  68.   function slide_preCursor(link) {
  69.     slide_precursor_timer.clear();
  70.     slide_precursor_timer = new Timer(function(){slide_preCursor(link);},slide_precursor_speed);
  71.     link.toggleClass('active');
  72.   }
  73.  
  74.   function Timer(callback,delay) {
  75.     var timerid, start, remaining = delay;
  76.     this.clear = function() {
  77.       window.clearTimeout(timerid);
  78.    }
  79.     this.pause = function() {
  80.       this.clear();
  81.       remaining -= new Date() - start;
  82.     };
  83.     this.resume = function() {
  84.       this.clear(); /* make sure we are not resuming without having cleared */
  85.       start = new Date();
  86.       timerid = window.setTimeout(callback, remaining);
  87.     };
  88.     this.resume();
  89.   }
  90. })(jQuery);
  91. /*</script>*/
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top