[Day13] Slide In on Scroll

捲軸滑動圖片出現的效果

需要用到的技巧與練習目標

1. scroll
2. 設計一個函式 每隔數秒在執行scroll
3. scrollY | innerHeight
4. offsetTop

scrollY

1 window.scroll 及 window.pageYOffset 功能相同，為卷軸滾動過的像素（捲軸離 軌道的起點的距離）
2. window.pageYOffset相容性比scrollY 要好一點，但IE(<9)以下兩這皆不兼容。

innerHeight

Window.innerHeight 為瀏覽器視窗的高度，若有捲軸，則包括捲軸高度。

offsetTop

element.offset 回傳元素 (element) 與親代元素頂部上邊的邊距。

參考資料來源:
1.https://developer.mozilla.org/zh-CN/docs/Web/API/Window/scrollY
2.https://www.796t.com/post/NWwwM2c=.html
3.https://developer.mozilla.org/zh-CN/docs/Web/API/Window/innerHeight
4.https://developer.mozilla.org/zh-TW/docs/Web/API/CSS_Object_Model/Determining_the_dimensions_of_elements
5. https://javascript.info/size-and-scroll
6.https://shubo.io/element-size-scrolling/
7.https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement/offsetTop