[網路資源]有趣的載入動畫網頁與應用Preloading Animations

/ 分類: , / 0 則回應

標籤:

如果網頁的檔案太大.受限制於現在的網路速度.要如何把瀏覽者的目光留住呢?
花俏的而有創意的載入畫面可以幫助你的網站在客人等待的時間暫時被吸引住
但是記得~~~在花俏的載入動畫也不能永遠留住目光
確實減少主頁檔案大小才是正確的方法阿~~

介紹幾個在網路上看到的一些有趣的載入畫面供大家參考

1-little-big-room

4-Spin

5-Alstercloud


以下為應用JS與CSS可以簡單的製作出載入動畫的範例

1-Spin

簡單的載入動畫.但是可以依照自己的意思去調整動畫的方式(推薦!!)

2-Single-Element-CSS-Spinners

多種載入動畫

2-Spin

讓人感到目眩神迷…利用兩點畫出多邊型對稱的美麗圖形(讓我看了有夠久的!!!)

3-Spin

遠方騎著自行車.進行特技表演

9-CSS-Loading-Boxes-Animation

利用四個方型色塊重疊分散循環

10-Text-Filling

水波紋與階梯式動盪的Loading動畫
12-Google-Inspired-CSS-Preloaders

Google的官方標識。創意利用其整潔和亮度不同的設計目的

發表留言