有點難敘述狀況,所以直接附上網址
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![]()