[問題] 網頁下滑觸發動畫是怎麼做的？ yorock PTT批踢踢實業坊

[問題] 網頁下滑觸發動畫是怎麼做的？

作者: yorock (Remix) 2018-03-07 12:25:37

https://www.papertiger.com/
https://www.adidas.com/us/speedfactory
上面是兩個範例網站
滑到特定位置時會觸發自訂的動畫
我目前知道 AOS.js 或 wow.js 這些
但這些好像都只能淡入淡出之類的效果
所以想請問像網頁上這種滑到特定位置才觸發自訂動畫的效果是怎麼寫的？
如果是監聽滾軸位置的話
在電腦版跟手機版時是不是要分開監聽？因為滾軸高度會不同
還是有什麼類似的 libarary 可以推薦？

作者: yuoo1580 (da5f) 2018-03-07 12:55:00

waypoints?

作者: ymcheung (ymc) 2018-03-07 13:42:00

scrollmagic 也很淺顯易懂不過最近碰到要算滑動距離，就要用 eqcss

作者: jones86723 (jones) 2018-03-13 13:56:00

我也是用Scroll magic

繼續閱讀

「出售」碁峰出版 Asp.net 程式開發美學Tripadvisor [問題] 在google搜尋顯示問題resad [問題] 設定zoom最低值（瀏覽器縮小）kimibear [問題] CSS3的特效教學網站wind681201 [問題] html5廢棄標籤Fordevoted Re: [問題] 網站大改影響搜尋引擎排行的問題idareyou [問題] 網站大改影響搜尋引擎排行的問題cooxander [問題] 在圖上畫圈圈lenofire [問題] 用CSS排版自動適應寬度的inline項目表danny0838 [問題] html5 拖放問題lenofire