媒體元件
圖片比較、畫廊、燈箱、影片容器、接觸印樣。媒體元件的重點是版面不跳動——尺寸要先保留。
共 16 個,其中 8 個免費、不需登入即可安裝。
自訂控制列播放器,控件淡出
音訊頻譜視覺化(Web Audio API)
拖曳分割前後對比
圖片放大鏡
Safari/iPhone/Android 裝置外框展示
捲動時畫面自 MacBook 螢幕升起
點擊播放的 hero 影片彈窗
捲動內容邊緣的漸進模糊遮罩
緩慢縮放平移的經典紀錄片式幻燈片,交叉淡接
音訊波形視覺化進度條,可拖曳 seek,已播區高亮
可播放的黑膠唱盤:唱片旋轉、唱針擺入、可拖碟搓盤
縮圖牆點擊放大的全螢幕燈箱:滾輪/捏合縮放與拖曳平移、雙擊放大、滑動與鍵盤切換、計數與說明列、Esc/背景關閉
擬物卡帶外觀的音訊播放器:捲軸隨播放時間旋轉、兩側磁帶量隨進度增減,倒帶動畫、可拖曳進度條與字幕軌。
純 CSS 3D 手機/平板/筆電舞台,五種編排:游標傾斜、捲動環繞、Y 軸翻轉、三台扇形陣列、捲動微距拉回;螢幕是真 DOM。
由中心向外逐格填入的封面格子牆,中央疊放滾動計數與文案,滑過單格推近、鄰格微退。
全幅圖片極快連續翻頁、中央內容固定不動的頻閃效果,播放結束停在最後一張;可由進入視口觸發。