2013-08-23 80 views
1

我建立了自己的幻燈片供自己使用,一切正常。我已經設置了一個時間間隔,可以調出不同的幻燈片。我無法使用clearInterval工作:/

現在我試圖添加暫停間隔懸停的可能性,並在離開幻燈片div後繼續它。

對你有沒有什麼建議?由於

這就是我現在所擁有的:

function slideContent(div) { 

    $('.contents').removeClass('act'); 

    if (div == 'first') { 
     $('#stretchWidth').stop().animate({ "left": 0}, 700); 
     $('.contents.first').addClass('act'); 
    } else if (div == 'second') { 
     $('#stretchWidth').stop().animate({ "left": -700}, 700); 
     $('.contents.second').addClass('act'); 
    } else if (div == 'third') { 
     $('#stretchWidth').stop().animate({ "left": -1400}, 700); 
     $('.contents.third').addClass('act'); 
    } else if (div == 'fourth') { 
     $('#stretchWidth').stop().animate({ "left": -2100}, 700);  
     $('.contents.fourth').addClass('act'); 
    } else if (div == 'fifth') { 
     $('#stretchWidth').stop().animate({ "left": -2800}, 700);  
     $('.contents.fifth').addClass('act'); 
    } 
}; 




function slideContentAutomatic() { 
    var $n; 
    $n = 1; 

    var run = function() { 

     switch($n) { 
      case 0: 
      slideContent('first') 
      $n++; 
      break; 

      case 1: 
      slideContent('second') 
      $n++; 
      break; 

      case 2: 
      slideContent('third') 
      $n++; 
      break; 

      case 3: 
      slideContent('fourth') 
      $n++; 
      break; 

      case 4: 
      slideContent('fifth') 
      $n = 0; 
      break; 
     } 
    } 

    $('#contentSlide').hover(function() { 
     clearInterval(run); 
    }, function(){ 
     setInterval(run, 4000); 
    }); 
} 

回答

4

你這是怎麼clearInterval

var x = setInterval(run, 4000); 

clearInterval(x); 
0

clearInterval應該只接受由setInterval的創造了一個獨特的ID間隔。我建議您將全局varibale設置爲IntervalID。

例如

var myIntervalId = null; 
function slideContentAutomatic() { 
    //..Your code.. 
    $('#contentSlide').hover(function() { 
     clearInterval(myIntervalId); 
    }, function(){ 
     setInterval(run, 4000); 
    }); 
} 

希望這會有所幫助。 https://developer.mozilla.org/en-US/docs/Web/API/window.clearInterval?redirectlocale=en-US&redirectslug=DOM%2Fwindow.clearInterval