网友回复
pace.js可以实现,他是一个加载进度条插件,代码示例如下
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>BFW NEW PAGE</title> <script id="bfwone" data="dep=jquery.17|pace.min&err=0" type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/bfwone.js"></script> <style> .pace { -webkit-pointer-events: none; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; z-index: 2000; position: fixed; margin: auto; top: 12px; left: 0; right: 0; bottom: 0; width: 200px; height: 50px; overflow: hidden; } .pace .pace-progress { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); display: block; position: absolute; right: 100%; margin-right: -7px; width: 93%; top: 7px; height: 14px; font-size: 12px; background: #29d; color: #29d; line-height: 60px; font-weight: bold; font-family: Helvetica, Arial, "Lucida Grande", sans-serif; -webkit-box-shadow: 120px 0 #fff, 240px 0 #fff; -ms-box-shadow: 120px 0 #fff, 240px 0 #fff; box-shadow: 120px 0 #fff, 240px 0 #fff; } .pace .pace-progress:after { content: attr(data-progress-text); display: inline-block; position: fixed; width: 45px; text-align: right; right: 0; padding-right: 16px; top: 4px; } .pace .pace-progress[data-progress-text="0%"]:after { right: -200px } .pace .pace-progress[data-progress-text="1%"]:after { right: -198.14px } .pace .pace-progress[data-progress-text="2%"]:after { right: -196.28px } .pace .pace-progress[data-progress-text="3%"]:after { right: -194.42px } .pace .pace-progress[data-progress-text="4%"]:after { right: -192.56px } .pace .pace-progress[data-progress-text="5%"]:after { right: -190.7px } .pace .pace-progress[data-progress-text="6%"]:after { right: -188.84px } .pace .pace-progress[data-progress-text="7%"]:after { right: -186.98px } .pace .pace-progress[data-progress-text="8%"]:after { right: -185.12px } .pace .pace-progress[data-progress-text="9%"]:after { right: -183.26px } .pace .pace-progress[data-progress-text="10%"]:after { right: -181.4px } .pace .pace-progress[data-progress-text="11%"]:after { right: -179.54px } .pace .pace-progress[data-progress-text="12%"]:after { right: -177.68px } .pace .pace-progress[data-progress-text="13%"]:after { right: -175.82px } .pace .pace-progress[data-progress-text="14%"]:after { right: -173.96px } .pace .pace-progress[data-progress-text="15%"]:after { right: -172.1px } .pace .pace-progress[data-progress-text="16%"]:after { right: -170.24px } .pace .pace-progress[data-progress-text="17%"]:after { right: -168.38px } .pace .pace-progress[data-progress-text="18%"]:after { right: -166.52px } .pace .pace-progress[data-progress-text="19%"]:after { right: -164.66px } .pace .pace-progress[data-progress-text="20%"]:after { right: -162.8px } .pace .pace-progress[data-progress-text="21%"]:after { ...
点击查看剩余70%
腾讯混元模型广场里都是混元模型的垂直小模型,如何api调用?
为啥所有的照片分辨率提升工具都会修改照片上的图案细节?
js如何在浏览器中将webm视频的声音分离为单独音频?
微信小程序如何播放第三方域名url的mp4视频?
ai多模态大模型能实时识别视频中的手语为文字吗?
如何远程调试别人的chrome浏览器获取调试信息?
为啥js打开新网页window.open设置窗口宽高无效?
浏览器中js的navigator.mediaDevices.getDisplayMedia屏幕录像无法录制SpeechSynthesisUtterance产生的说话声音?
js中mediaRecorder如何录制window.speechSynthesis声音音频并下载?
python如何直接获取抖音短视频的音频文件url?