標籤: 動態效果 頁1
網路資源
SVG Artista：好用的 SVG 動畫產生器，產生出來的動畫可以直接應用在網頁上
SVG Artista 是一個線上 SVG 動畫產生器，只要上傳檔案到網站上，然後透過介面調整參數，接著將 SVG 以及 CSS 的原始碼複製後，就可以在網站上使用了。
網路資源
Fullscreen HTML5 Background Video- 好用的 javascript 網頁背景影片幻燈片播放套件
Fullscreen HTML5 Background Video 是一個好用的 javascript 網頁背景影片幻燈片播放套件，本篇將說明使用方法。
網路資源
Vegas Background SlideShow- 好用的全螢幕背景幻燈片播放套件
Vegas Background SlideShow 是一個好用的全螢幕背景幻燈片播放套件，而且可以自訂的部分很多，更可以設定影片當作播放的項目。
網路資源
使用 youtube-background.js 把 Youtube 影片設定成網頁上的背景播放影片
youtube-background.js 是一個可以把 Youtube 影片設定成網頁上的背景播放影片的 jQuery 套件，簡單設定後就可以將指定的 YouTube 影片在頁面上的背景播放了。
網路資源
YTPlayer- 好用的把 YouTube 當背景影片的 jQuery 套件，更可以設定影片的濾鏡效果
YTPlayer 是一個好用的把 YouTube 當背景影片的 jQuery 套件，更可以設定影片的濾鏡效果。
網路資源
Pageable- 好用的一頁式捲動(one page scroll) javascript library
Pageable 是一個好用的一頁式捲動(one page scroll) javascript library，說明一下使用方法。
網路資源
Spline- 給網頁用的 3D 場景及互動元件設計工具
Spline 是一個給網頁用的 3D 場景及互動元件設計工具，可以透過其提供的介面簡單的產出網頁的 3D 元素，之後透過匯出就可以把內容放在自己的網站了。
網路資源
SortableJS- 簡單好用的網頁元素拖曳(drag and drop)及排序(sort)套件
SortableJS 是一個簡單好用的網頁元素拖曳(drag and drop)及排序(sort)套件，可以參考本文安裝及設定套件內容。
網路資源
Web Animation Course- 說明網頁動畫的原理以及提供一些範例的網站
Web Animation Course 是一個有著說明網頁動畫的原理，以及提供一些範例的網站，對動畫有興趣的朋友推薦去瀏覽一下了解原理，或者是吸收靈感。
![[jQuery Plugin] onepageNav.js 選單與捲動位置的互動效果](/assets/upload/1588088792122_0.jpg)
網路資源
[jQuery Plugin] onepageNav.js 選單與捲動位置的互動效果
onepageNav.js 就是可以用來簡單製作捲動與選單互動效果的套件，這隻是 jQuery 的，所以要先讀入 jQuery 後再讀取這隻 plugin。
網路資源
Easing Functions Cheat Sheet- 收錄許多 CSS 動畫效果的網站
Easing Functions Cheat Sheet 是一個收錄了許多 CSS 動畫效果的網站，可以預覽後，選擇喜歡的效果並複製 CSS 的語法即可。
網路資源
CSS3 Animation Cheat Sheet- 收錄許多 CSS 動畫效果的網站
CSS3 Animation Cheat Sheet 是一個收錄許多 CSS 動畫效果的網站，只要讀入其設計的 CSS 後，就可以依據給予的 class name 設定動畫效果。
網路資源
LottieFiles- 收錄透過 After Effect 外掛 bodymovin 轉出來的動畫網站
之前跟大家介紹過 bodymovin 這個可以把 After Effect 的動畫轉出來給網頁用的外掛，而他們官方也有提供使用者分享各自製作的動畫的網站，可以到上面找找有沒有喜歡的動畫效果。