24個純 CSS 打造的等待動畫圖示 隨取即用

24個純 CSS 打造的等待動畫圖示 隨取即用

網頁處理、運算、傳輸都需要時間,如果讓使用者乾等待,就容易產生當機的錯覺,因此,在這段時間產生一個提示訊息藉此告訴使用者耐心等待是有必要的,而現行網頁最常見的就是使用等待動畫圖示,負責處理到呈現這段時間的呈現,這個動畫可以使用 GIF 圖檔,也可以使用純 CSS 語法打造,24 PURE CSS3 PRELOADERS 這個網站展示了 24個純 CSS 等待動畫圖示,只需在網頁中引用該 CSS 檔案,就可輕易實現等待中使用動畫圖示來提示。

§相關文章,還可以參閱:

如何使用 24 PURE CSS3 PRELOADERS 所提供的等待動畫圖示?

1.使用瀏覽器進入 24 PURE CSS3 PRELOADERS 的等待動畫圖示展示網頁。

24個純 CSS 打造的等待動畫圖示 隨取即用

2.接下來轉到 GitHub - MarinaOsadcha/Preloaders 網站下載範例與 CSS 檔案。

24個純 CSS 打造的等待動畫圖示 隨取即用

3.解壓縮下載的檔案後,在欲使用等待動畫圖示的網頁 head 區域中引用該 CSS 檔案。

24個純 CSS 打造的等待動畫圖示 隨取即用

4.找到欲使用的動畫圖示,將其複製到 HTML Body 區快要顯示的位置,後續便可利用 JavaScript 來控制需要呈現的時機。

24個純 CSS 打造的等待動畫圖示 隨取即用

OneDrive 是微軟所推出的雲端儲存空間,除了可以儲存檔案外,亦可以建立 Word、Excel、Forms...等 Office 文件,而在 OneDrive內的檔案亦可以共用或內嵌到網頁中,檔案可以內嵌,那麼資料夾呢?答案是同樣也可以,但權限僅限於檢視與下載,無法上傳、更改或刪除,想要在網頁內嵌 OneDrive 資料夾的操作非常簡單,其採用 iframe 語法,只要複製該語法貼到網頁要呈現的位置即可以完成。

以前從網路下載的圖片大多是 JPG、PNG 或是 WebP 等圖檔格式,而現在很多人在下載圖片時會發現還有種以 JfIf為副檔名的圖片格式, 其實「.JfIf」檔案是由 JPEG 圖檔格式所衍生出來的,同樣是具備以 JPEG 標準定義的圖片格式,雖說是由 JPEG 衍生,但很多的圖片編輯軟體都無法識別,那麼這種檔案該如何開啟或轉檔成 JPG 圖檔呢?要開啟 JfIf圖片,使用瀏覽器最方便,如果是 Windows 11,那麼你也可以利用內建的「相片」應用程式來預覽以 JfIf為副檔名的圖片,也可以利用它來另存成 JPG、PNG、BMP、TIFF等不同的圖片格式,但一次只能轉一張圖片,如果有很多,也可以使用像是 <a href="https://anyconv.com/tw/jfif-zhuan-jpg/" >JFIF 轉 JPG - Any Conv</a>這類免費的網路應用程式。