2016-01-21 102 views
1

執行我已經使用animation(),我希望它只是在懸停事件的工作,並在鼠標移開
只有兩個問題現在面臨重置圖像的默認位置的照片一sldieshow插件,是我可以「T停止動畫,以及過多的內存的瀏覽器阻止使用
這裏是我使用:while語句無限

$('.slideshow').hover(function() { 
    $(this).find('li:first').attr('flag', ''); 
    $(this).slide() 
}, function() { 
    $(this).find('ul').stop(true); //if you keep the mouse a little bit long it wont stop 
    // and this while statement blocks the browser 
    while ($('[flag]').index() != 0) { 
    $(this).slide(1) // the parameter 1 here is to slide only once 
    } 
}) 

爲全面瞭解起見,這裏是我[DEMO]
所以我上面說是我真正期待,但它得到堆棧而不是
爲什麼發生這種情況 注意:當條件不滿足我沒有使用任何增量,因爲幻燈片插件只被執行一次,然後將它重新執行

+0

嘗試'setTimeout'和遞歸函數的組合。測試懸停在功能的頂部。 – Blazemonger

+0

有些人喜歡[**這個**](https://jsfiddle.net/AmineTbaik/yfk45k86/2/)? 由於未知原因,索引總是返回-1 – Amine

回答

1

您可能希望這樣的事情(請用實際的代碼完成):

function changeSlide(ss) { 
    if ($(ss).hasClass('hover') { 
     // transition to the next slide 
    } 
    setTimeout(function() {changeSlide(ss)}, 5000 /*milliseconds*/); 
} 
$('.slideshow').on('mouseover',function() { 
    $(this).addClass('hover'); 
    changeSlide(this); 
}).on('mouseout',function() { 
    $(this).removeClass('hover'); 
}); 

Modified demo