有點難敘述狀況,所以直接附上網址
http://www.sldesign.url.tw/demo/demo.htm
我把變數更改後重寫一次,原本只有一組的時候
點擊都很正常,但是兩個或多個以上就會連跳
附上我的js
http://www.sldesign.url.tw/demo/js/stacking.js
在此菜鳥感謝大家
看起來是因為你已經在 stacking.js
裡個別對 #stage
與 #stage2
都做了處理與事件的監聽,但是在 HTML 裡你又呼叫了 $('#stage').stack()
與 $('#stage2').stack()
,所以等於做了兩次事件監聽,當然會做兩次動作。
建議你可以用 this
重構,令 stack
只針對使用它的那個元素做處理,才不會再發生類似的事情。
真快就結案了XD
打到一半就照貼了
最主要的問題就是
因為你綁了兩次 .stack
然後你的 stack 又寫了所有的 stage 的動作
所以最簡單要達到你原本的目的
就是把你原本 code 綁的第二個 stack 拿掉
就會是你要的結果了
不過即使這樣你的 code 也還是有很大的問題
幾乎不可重複利用
應該要向樓上 leo大 所說
重構你的 code
對被觸發 event 的 stack 來進行 animation
甚至
把一些重複的部分也寫進去 stack 裡
e.g. next/previous button
然後
日後有需要類似的功能
理想情況
就 import 此 js
然後 html 只需補上
<div class = "stage">
<img>...
<img>...
<img>...
</div>
就可以了
然後寫更多的 animation
打包起來
放到 github 上騙星星XD