Scroll down to explore the content
這個專題展示了如何將影片作為網頁背景，搭配半透明遮罩層與文字內容，創造出層次豐富的視覺效果。透過滾動互動，使用者可以控制影片播放進度，實現沈浸式的敘事體驗。
本專題運用 jQuery 監聽滾動事件，計算當前滾動位置與總可滾動距離的比例，並將此比例對應到影片的播放時間軸。透過 videoElement.currentTime 屬性，實現滾動與影片進度的同步控制。
文字區塊使用 Flexbox 佈局來實現完美置中。在父容器設定 display: flex、align-items: center（垂直置中）和 justify-content: center（水平置中），讓內容在任何螢幕尺寸下都能保持在畫面正中央。
Let's convert these divs to flying cards