2009-10-12 51 views
0

我正在創建一個具有更改文本和圖像的滾動鏈接的圖像橫幅。我需要發生的事情是每隔5秒旋轉5個圖像,但在鼠標懸停時它會暫停旋轉並帶您進入用戶選擇的圖像。我的鼠標懸停代碼是:在計時器上更改類Jquery

$("#main_nav li").mouseover(function() { 
    $(".navigation_main, .main_info").each (function() { 
     $(this).removeClass("on").addClass("off"); 
            }); 
    $("#"+$(this).attr("id")).removeClass("off").addClass("on"); 
    $("#"+$(this).attr("id")+"_images").removeClass("off").addClass("on"); 
    $("#"+$(this).attr("id")+"_text").removeClass("off").addClass("on"); 
    $("#"+$(this).attr("id")+"_a").removeClass("off").addClass("on"); 
          }); 

獲得此旋轉的任何幫助都會很好。

非常感謝

回答

1

下面是jQuery的週期插件是怎麼做的:

例如: http://malsup.com/jquery/cycle/pagerHover.html

如果暫停選項設置,然後懸停增加一個名爲cyclePause導致幻燈片不變量以進行旋轉:

if (opts.pause) 
    $cont.hover(function(){this.cyclePause++;},function(){this.cyclePause--;}); 

稍後對循環暫停進行檢查。如果是,那麼就沒有前進。

case 'pause': 
     cont.cyclePause = 1; 
     return false; 
    case 'resume': 
     cont.cyclePause = 0; 
     if (arg2 === true) { // resume now! 
      options = $(cont).data('cycle.opts'); 
      if (!options) { 
       log('options not found, can not resume'); 
       return false; 
      } 
      if (cont.cycleTimeout) { 
       clearTimeout(cont.cycleTimeout); 
       cont.cycleTimeout = 0; 
      } 
      go(options.elements, options, 1, 1); 
     } 
     return false;