當我的幻燈片切換到下一張幻燈片時，如何創建圖像動畫

Question

我正在使用jQuery Cycle Plugin。

這些是插件提供的選項。 http://jquery.malsup.com/cycle/options.html

我有5個不同的幻燈片。但是每張幻燈片在幻燈片內部都有兩到三張圖片，應該在幻燈片的不同位置生成動畫，我該如何實現這一點？ 或者是否有另一個jQuery插件可以讓你做到這一點？

例如， 我有一張幻燈片，有一輛車，一朵雲彩和一張太陽。所以當用戶徘徊或到達這張幻燈片。這款車將要設置動畫中心，然後在雲和太陽將動畫和車後的動畫自己定位。

Answer 1

您需要的視差滑塊。 Here你可以看到一個例子。

Answer 2

那麼你可以做幾件事情。你可以做到這一點，當鼠標懸停在圖像上時，它會變成一個動畫本身的gif。

.background:hover { 
background-image: url('<filepath>/animate.gif'); 
} 

或者你可以做的是單擊按鈕時，其中一個jQuery事件，或當鼠標懸停（有點麻煩，在我看來），每個元素（在上面運行單獨的圖像，可能通過ž - 指數）將動畫和滑過。

如果您使用jQuery插件，我會推薦第一個選項。

Answer 3

視差可能是一個潛在的解決方案，但我會更多地看循環提供的選項。

看看這個例子：http://jquery.malsup.com/cycle/int2.html

走向之前提到的底部和幻燈片回調之後。因此，理論上講，您可以調用一個函數來將所有內容製作成動畫，然後當下一張幻燈片進入時，爲下一張幻燈片調用下一個動畫（如果有）。

如果滑塊在定時器上，這可能會很麻煩。要時刻銘記在心。