如果您喜歡我的分享、或是我的文章對您有幫助的話,希望能到我的粉絲專頁點個讚追蹤我唷~~

寫程式、技術分享文章很辛苦,寫一篇要花非常久的時間,希望您能幫我點一下頁面上的廣告給我支持跟肯定,讓我更有動力寫這類文章唷~
關於本demo執行邏輯:
  • 包附照片list的div命名規則化,例如id=pic1~pic8設定其編號。
  • 採用javascript中的setInterval方法,讓固定時間內重複執行以下動作。
  • 在傳入每次要執行滑行動作的編號時,先預設將所有照片div設為隱藏並層級設為最低。
  • 但前一張額外改成顯示不隱藏。
  • 將這次要執行滑行動作的的圖檔打開顯示並層級設為最高。
  • 將這次要執行滑行動作的的圖檔套用滑行語法,並重設下一張的編號供setInterval使用。
  • 本次滑行效果使用jQuery ui中的show Effects來呈現。
1
  /  
照片來源:香腸炒魷魚。感謝香腸兄熱心提供照片~~~