博客園美化：增加頂部炫彩loading進度條

来源:https://www.cnblogs.com/zhangshuhao1116/p/18199513
-Advertisement-
Play Games

之前已經出了一篇關於loading動畫的隨筆《博客園美化：給網頁加上loading動畫》，但是每次載入都必須等loading動畫載入完成才能進行下一步點擊，很浪費時間，所以pass掉了...... 這次做了一個頂部的loading進度條，載入的同時不影響瀏覽點擊網頁，並且進度條顏色十分酷炫（ 非主流 ...


之前已經出了一篇關於loading動畫的隨筆《博客園美化：給網頁加上loading動畫》，但是每次載入都必須等loading動畫載入完成才能進行下一步點擊，很浪費時間，所以pass掉了......

這次做了一個頂部的loading進度條，載入的同時不影響瀏覽點擊網頁，並且進度條顏色十分酷炫（  非主流  ）的那種。

話不多說，先上效果圖：

image

酷炫吧......

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 鴻蒙HarmonyOS實戰-Stage模型（開發卡片事件）
    一、開發卡片事件 HarmonyOS元服務卡片頁面（Metaservice Card Page）是指在HarmonyOS系統中，用於展示元服務的頁面界面。元服務是指一組提供特定功能或服務的組件，例如天氣服務、音樂播放服務等。元服務卡片頁面可以顯示元服務的相關信息和操作選項，用戶可以通過點擊卡片頁 ...
  • 鴻蒙HarmonyOS實戰-Stage模型（開發卡片頁面）
    一、開發卡片頁面 HarmonyOS元服務卡片頁面（Metaservice Card Page）是指在HarmonyOS系統中，用於展示元服務的頁面界面。元服務是指一組提供特定功能或服務的組件，例如天氣服務、音樂播放服務等。元服務卡片頁面可以顯示元服務的相關信息和操作選項，用戶可以通過點擊卡片頁 ...
  • 鴻蒙HarmonyOS實戰-Stage模型（服務卡片的模塊和創建）
    一、服務卡片的模塊和創建 在HarmonyOS中，服務卡片是一種提供即時信息和快速操作的小組件，類似於Android中的通知欄。服務卡片可以顯示各種類型的信息，包括通知、天氣、日曆事件、音樂播放器、快捷方式等。用戶可以根據自己的需求配置服務卡片，並通過輕掃或點擊來查看詳細信息或執行操作。此外，服 ...
  • TypeScript入門介紹
    一、是什麼 單點登錄（Single Sign On），簡稱為 SSO，是目前比較流行的企業業務整合的解決方案之一 SSO的定義是在多個應用系統中，用戶只需要登錄一次就可以訪問所有相互信任的應用系統 SSO 一般都需要一個獨立的認證中心（passport），子系統的登錄均得通過passport，子系統 ...
  • lodash已死？radash庫方法介紹及源碼解析 —— 函數柯里化 + Number篇
    點贊 + 收藏 = 學會！ 本篇我們介紹radash中函數柯里化和Number 相關的方法使用和源碼解析。深入學習radash中的方法思想和底層實現。 ...
  • 終於搞懂了！原來 Vue 3 的 generate 是這樣生成 render 函數的
    前言 在之前的 面試官：來說說vue3是怎麼處理內置的v-for、v-model等指令？ 文章中講了transform階段處理完v-for、v-model等指令後，會生成一棵javascript AST抽象語法樹。這篇文章我們來接著講generate階段是如何根據這棵javascript AST抽象 ...
  • XML Schema 複雜元素類型詳解：定義及示例解析
    在XML Schema（XSD）中，複雜元素包含其他元素和/或屬性，分為4類：空元素、僅含元素、僅含文本和既含元素也含文本。定義複雜元素可通過直接聲明或引用預定義的複雜類型。複雜空元素僅含屬性，而僅含元素的類型則只包含其他子元素。XSD提供了`<xs:sequence>`、`<xs:all>`、`<... ...
  • 解釋下什麼是事件代理？應用場景？
    一、是什麼 事件代理，俗地來講，就是把一個元素響應事件（click、keydown......）的函數委托到另一個元素 前面講到，事件流的都會經過三個階段： 捕獲階段 -> 目標階段 -> 冒泡階段，而事件委托就是在冒泡階段完成 事件委托，會把一個或者一組元素的事件委托到它的父層或者更外層元素上，真 ...
一周排行
    -Advertisement-
    Play Games
  • （開源）都進來！簡單易懂、功能強大的許可權+可視化流程管理系統
    1、預覽地址：http://139.155.137.144:9012 2、qq群:801913255 一、前言 隨著網路的發展，企業對於信息系統數據的保密工作愈發重視，不同身份、角色對於數據的訪問許可權都應該大相徑庭。 列如 1、不同登錄人員對一個數據列表的可見度是不一樣的，如數據列、數據行、數據按鈕 ...
  • 設計模式-C#實現簡單工廠模式
    前言 上一篇文章寫瞭如何使用RabbitMQ做個簡單的發送郵件項目，然後評論也是比較多，也是準備去學習一下如何確保RabbitMQ的消息可靠性，但是由於時間原因，先來說說設計模式中的簡單工廠模式吧！ 在瞭解簡單工廠模式之前，我們要知道C#是一款面向對象的高級程式語言。它有3大特性，封裝、繼承、多態。 ...
  • Nodify學習 一：介紹與使用
    Nodify學習 一：介紹與使用 - 可樂_加冰 - 博客園 (cnblogs.com) Nodify學習 二：添加節點 - 可樂_加冰 - 博客園 (cnblogs.com) 介紹 Nodify是一個WPF基於節點的編輯器控制項，其中包含一系列節點、連接和連接器組件，旨在簡化構建基於節點的工具的過程 ...
  • 使用C#/.NET解析Wiki百科數據實現獲取歷史上的今天
    創建一個webapi項目做測試使用。 創建新控制器，搭建一個基礎框架，包括獲取當天日期、wiki的請求地址等 創建一個Http請求幫助類以及方法，用於獲取指定URL的信息 使用http請求訪問指定url，先運行一下，看看返回的內容。內容如圖右邊所示，實際上是一個Json數據。我們主要解析 大事記 部 ...
  • .NET科普：.NET簡史、.NET Standard以及C#和.NET Framework之間的關係
    最近在不少自媒體上看到有關.NET與C#的資訊與評價，感覺大家對.NET與C#還是不太瞭解，尤其是對2016年6月發佈的跨平臺.NET Core 1.0，更是知之甚少。在考慮一番之後，還是決定寫點東西總結一下，也回顧一下.NET的發展歷史。 首先，你沒看錯，.NET是跨平臺的，可以在Windows、 ...
  • Nodify學習 二：添加節點
    Nodify學習 一：介紹與使用 - 可樂_加冰 - 博客園 (cnblogs.com) Nodify學習 二：添加節點 - 可樂_加冰 - 博客園 (cnblogs.com) 添加節點（nodes） 通過上一篇我們已經創建好了編輯器實例現在我們為編輯器添加一個節點 添加model和viewmode ...
  • 論如何直接用EF Core實現創建更新時間、用戶審計，自動化樂觀併發、軟刪除和樹形查詢（上）
    前言 資料庫併發，數據審計和軟刪除一直是數據持久化方面的經典問題。早些時候，這些工作需要手寫複雜的SQL或者通過存儲過程和觸發器實現。手寫複雜SQL對軟體可維護性構成了相當大的挑戰，隨著SQL字數的變多，用到的嵌套和複雜語法增加，可讀性和可維護性的難度是幾何級暴漲。因此如何在實現功能的同時控制這些S ...
  • C# 使用模式匹配的好處,因為好用所以推薦~
    類型檢查和轉換：當你需要檢查對象是否為特定類型，並且希望在同一時間內將其轉換為那個類型時，模式匹配提供了一種更簡潔的方式來完成這一任務，避免了使用傳統的as和is操作符後還需要進行額外的null檢查。 複雜條件邏輯：在處理複雜的條件邏輯時，特別是涉及到多個條件和類型的情況下，使用模式匹配可以使代碼更 ...
  • 推薦一種批量判斷文件是否存在的快速辦法
    在日常開發中，我們經常需要和文件打交道，特別是桌面開發，有時候就會需要載入大批量的文件，而且可能還會存在部分文件缺失的情況，那麼如何才能快速的判斷文件是否存在呢？如果處理不當的，且文件數量比較多的時候，可能會造成卡頓等情況，進而影響程式的使用體驗。今天就以一個簡單的小例子，簡述兩種不同的判斷文件是否... ...
  • 論如何直接用EF Core實現創建更新時間、用戶審計，自動化樂觀併發、軟刪除和樹形查詢（中）
    前言 資料庫併發，數據審計和軟刪除一直是數據持久化方面的經典問題。早些時候，這些工作需要手寫複雜的SQL或者通過存儲過程和觸發器實現。手寫複雜SQL對軟體可維護性構成了相當大的挑戰，隨著SQL字數的變多，用到的嵌套和複雜語法增加，可讀性和可維護性的難度是幾何級暴漲。因此如何在實現功能的同時控制這些S ...
所有分類