给你的网站添加个页面加载进度条
大家好
无意中发现了一个能制作自动页面加载进度条的网页
测试了一下，效果不错
发来给大家试试
网站在这：https://codebyzach.github.io/pace/
进入后会有一个既炫酷又平平无奇的加载动画
向下翻可以看到预设的一些加载动画
先选择颜色，再选择样式
样式随便选一个，就loading bar吧
点击DOWNLOAD
然后将它放在你的网站上，我就放在https://skyshadowhero.github.io/css/loading-bar.css里的
然后复制网站中Get Start里中间的的代码，并将红色方框里的路径改为你所放的css文件路径
然后将编辑好的代码放进html文件里的标签前即可
如果使用的Hexo+Butterfly搭建博客的话可以直接将此两行代码放在_config.butterfly.yml里的相关位置
在bash中输入hexo g -d后进入网页，你的页面加载进度条就出现了
效果如下图：
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 天影大侠的小站！
相关推荐
2023-08-12
使用typed.js来给你的网页添加打字效果吧
使用typed.js来给你的网页添加打字效果吧typed.js官网看这JavaScript Animated Typing with Typed.js | by Matt Boldt 先看看效果: 右侧公告栏也是同样的方法 使用指北：先在head或body里引入js 1<script src="https://unpkg.com/typed.js@2.0.16/dist/typed.umd.js"></script> 然后再创建一个自己的js文件，输入以下代码 123var typed = new Typed('#hello-world', { strings: ['Hello World!']}); 在引入typed.js的cdn后面引入你的js文件 再在html里输入 1<span...
2023-07-23
在你的html或文章里运行python
前言这里是2025年的天影大侠，这不知道从哪找的个东西，都忘了自己弄过这个。 问候大家好 发文章的时候总是只能发代码，不能运行 现在发现了一个东西，可以在你的文章中直接运行python 它就是pyscript，来看看吧 [官方文档](PyScript — PyScript documentation)在这<– 第一步想要在你的文章中运行python代码，请先在前引入pyscript的css和js 12<link rel="stylesheet" href="https://pyscript.net/latest/pyscript.css" /><script defer src="https://pyscript.net/latest/pyscript.js"></script> 第二步在你的文章body里添加，并在标签前插入你的python代码 比如 123<py-script> print('Hello...
2025-04-05
给你的网站后面加上一只会跟着鼠标动的小蜘蛛
先看效果源码原地址：CodePen:Parametric Spider稍微修改了一下，去掉了设置和署名，分享一下代码 HTML里要引入https://unpkg.co/gsap@3/dist/gsap.min.js 和 https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.7.9/dat.gui.min.js然后再放上 1<canvas id="spidercanvas" /> 即可如果想要一个按钮可以打开或关闭它的话，可以加上 1<button onclick="spider()"...
评论
