Tip: Click lines to highlight, hold ctrl/cmd to multi-select

http://codedumper.com/evimo (2-Feb @ 01:08)

Syntax Highlighted Code

  1. ///////////////////////////////////////////////
  2. // autoscroll
  3. ///////////////////////////////////////////////
  4.  
  5. // first hide the navigation buttons
  6. var $buttons = $('img.right').add('img.left').hide();
  7.  
  8. // start to automatically cycle the tabs
  9.    cycleTimer = setInterval(function () {
  10.    $scroll.trigger('next');
  11. }, 5000);  // how many milliseconds, change this to whatever you like
  12.  
  13. // select some trigger elements to stop the auto-cycle
  14. var $stopTriggers = $('#slider .navigation').find('a')    // tab headers
  15.     .add('.scroll')                     // panel itself
  16.     .add('.stopscroll')             // links to the stop class div
  17.     .add('.navigation')          // links to navigation id for tabs
  18.     .add("a[href^='#']");      // links to a tab
  19.  
  20. // this is the function that will stop the auto-cycle
  21. function stopCycle() {
  22.    // remove the no longer needed stop triggers
  23.    clearInterval(cycleTimer);          // stop the auto-cycle itself
  24.    $buttons.show();                           // show the navigation buttons
  25.    document.getElementById('stopscroll').style.display='none';    // hide the stop div
  26.    document.getElementById('startscroll').style.display='block';  // block the start div
  27. }
  28.  
  29. // bind stop cycle function to the click event using namespaces
  30. $stopTriggers.bind('click.cycle', stopCycle);
  31.  
  32. ///////////////////////////////////////////////
  33. // end autoscroll
  34. ///////////////////////////////////////////////
  35. //  edit to start again
  36. ///////////////////////////////////////////////
  37. // select some trigger elements to stop the auto-cycle
  38.  
  39. var $startTriggers_start = $('#slider .navigation').find('a') // tab headers
  40.     .add('.startscroll');               // links to the start class div
  41.  
  42. // this is the function that will stop the auto-cycle
  43. function startCycle() {
  44.    // remove the no longer needed stop triggers
  45.    $buttons.hide();                    // show the navigation buttons
  46.    $scroll.trigger('next');          // directly to the next first
  47.    cycleTimer = setInterval(function () {         // now set timer again
  48.    $scroll.trigger('next');
  49.    }, 5000);  // how many milliseconds, change this to whatever you like
  50.    document.getElementById('stopscroll').style.display='block';  // block the stop div
  51.    document.getElementById('startscroll').style.display='none';  // hide the start div
  52. }
  53.  
  54. // bind stop cycle function to the click event using namespaces
  55. $startTriggers_start.bind('click.cycle', startCycle);
  56.  
  57. ///////////////////////////////////////////////
  58. // end  edit to start
  59. ///////////////////////////////////////////////

Plain Code

///////////////////////////////////////////////
// autoscroll
///////////////////////////////////////////////

// first hide the navigation buttons
var $buttons = $('img.right').add('img.left').hide();

// start to automatically cycle the tabs
   cycleTimer = setInterval(function () {
   $scroll.trigger('next');
}, 5000);  // how many milliseconds, change this to whatever you like

// select some trigger elements to stop the auto-cycle
var $stopTriggers = $('#slider .navigation').find('a')    // tab headers
    .add('.scroll')                     // panel itself
    .add('.stopscroll')             // links to the stop class div
    .add('.navigation')          // links to navigation id for tabs
    .add("a[href^='#']");      // links to a tab

// this is the function that will stop the auto-cycle
function stopCycle() {
   // remove the no longer needed stop triggers
   clearInterval(cycleTimer);          // stop the auto-cycle itself
   $buttons.show();                           // show the navigation buttons
   document.getElementById('stopscroll').style.display='none';    // hide the stop div
   document.getElementById('startscroll').style.display='block';  // block the start div
}

// bind stop cycle function to the click event using namespaces
$stopTriggers.bind('click.cycle', stopCycle);

///////////////////////////////////////////////
// end autoscroll
///////////////////////////////////////////////
//  edit to start again
///////////////////////////////////////////////
// select some trigger elements to stop the auto-cycle

var $startTriggers_start = $('#slider .navigation').find('a') // tab headers
    .add('.startscroll');               // links to the start class div

// this is the function that will stop the auto-cycle
function startCycle() {
   // remove the no longer needed stop triggers
   $buttons.hide();                    // show the navigation buttons
   $scroll.trigger('next');          // directly to the next first
   cycleTimer = setInterval(function () {         // now set timer again
   $scroll.trigger('next');
   }, 5000);  // how many milliseconds, change this to whatever you like
   document.getElementById('stopscroll').style.display='block';  // block the stop div
   document.getElementById('startscroll').style.display='none';  // hide the start div
}

// bind stop cycle function to the click event using namespaces
$startTriggers_start.bind('click.cycle', startCycle);

///////////////////////////////////////////////
// end  edit to start
///////////////////////////////////////////////

Permalink: http://codedumper.com/evimo