發表文章

目前顯示的是 1月, 2020的文章

以成 - 個人網站

圖片
個人網站與相關資訊 連結至個人網站 主站: bian0726.com (目前功能調整中) 音響專區: wp.bian0726.com (記錄我的音響歷程與相關文章) 我的相關名稱 以成 邊以成 bob_bian bian0726 bob_bianbian 部落格說明 目前兩個網站皆設有 Blog 文章區。未來會持續發表更有內容的文章。由於先前的 Blog 是自己寫程式實作,內容呈現效果與主流 Blog 平台相比仍有改進空間,因此暫時規劃為個人測試使用的網址;另外,從大學時期就開始學習的 WordPress 架站,如今也開設了獨立的 WordPress 網站,藉此測試各項功能並順便記錄音響歷程。等到時機成熟後,將會對這兩個平台做更完善的規劃與調整。 網站記事 2017 年: 購買 Mac mini 2014 Late 作為伺服器使用 2024/10/25: 舊 Mac mini 關機後無法再次啟動,隨即訂購 Mac mini M4 2024/11/18: 正式啟用 Mac mini M4 作為新伺服器

網頁Loading載入效果 Web page loading effect

圖片
新增網頁在loading時的動畫效果 Add animation effect to the web page when loading 前端如果有大量元素要載入的時候,為了呈現畫面的美觀,通常都會有一個 Loading 的畫面 When the front end has a lot of elements to load, there is usually a loading screen to show the beauty of the interface. 先前加入這個效果本來是要解決 Js 載入網站有延遲,導致跑版的問題,不過修改一個 Class 之後就解決了 Previously, this effect was added to solve the problem of Js loading the website with delay, causing the layout to be messed up, but it was solved after modifying a class. 可是既然已經找到相關的製作方式,何不套用在網站中呢 ~ But since I have found the relevant production method, why not apply it to the website? 另外設定 Timeout 的原因就是在頻繁切換網頁的時候,如果網頁載入沒有延遲,loading 畫面會一閃而過,不太美觀。 Another reason for setting the timeout is that when switching pages frequently, if the website loads without delay, the loading screen will flash by, which is not very beautiful. 此次參考的網頁 Loading 相關的程式碼 http://srdesign.com.tw/design/thread-538-1-1.html https://dometi.com.tw/blog/loading/ https://www.w3schools.com/howto/howto_css_l...