5-1. 認識瀏覽器事件scroll()及設計隨視窗捲動再回到指定位置的區塊

(1) 認識瀏覽器捲動事件scroll()及相關方法、屬性

事件及相關 說明
scroll() 當滑鼠滾輪滾動時, 或是拖曳視窗捲軸時, 語法:$(selector).scroll(function),[參考][參考]
scrollTop() 取得文件滑出視窗上方的距離, 語法:$(selector).scrollTop(), [參考][參考]
scrollTop animate()時改變的屬性, 控制元素頂端與可視範圍(視窗)上方的距離, [參考][參考]

 

(2) 運用animate及scroll()事件設計隨視窗捲動再回到指定位置的區塊

HTML:

CSS:

JS: