进度条 Vue2 +PC端 ,点击页面加载时页面顶部的那个蓝条

news2024/11/16 0:56:18

 提示:

 

 

 <div class="global-loading"> </div>

css:less 


<style lang="less">
.global-loading {
  background-color: red;
  height: 10px;
  position: fixed;
  z-index: 999;
  width: 0;
  animation: grow 2s infinite forwards;

}

@keyframes grow {
  from {
    width: 0;
  }

  to {
    width: 100%;
  }
}
</style>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/812271.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

ROS从入门到精通6-8:costmap代价地图插件编写案例(prohibition_layer)

目录 0 专栏介绍1 为什么需要代价地图插件?2 自定义代价地图插件3 仿真测试0 专栏介绍 本专栏旨在通过对ROS的系统学习,掌握ROS底层基本分布式原理,并具有机器人建模和应用ROS进行实际项目的开发和调试的工程能力。 🚀详情:《ROS从入门到精通》 1 为什么需要代价地图插…

PHP: 开发入门macOS系统下的安装和配置

安装Homebrew 安装 ~~友情提示&#xff1a;这个命令对网络有要求&#xff0c;可能需要翻墙或者用你的手机热点试试&#xff0c;或者把DNS换成&#xff08;114.114.114.114 和 8.8.8.8&#xff09; /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebr…

tensorRT模型性能测试

目录 前言1. 模型训练1.1 模型1.2 数据集1.3 xml2yolo1.4 yolo2json1.5 json2yolo1.6 训练 2. TRT模型转换2.1 YOLOv5 ONNX导出2.2 YOLOv6 ONNX导出2.3 YOLOv5 engine生成2.4 YOLOv6 engine生成 3. TRT模型测试3.1 YOLOv5 engine mAP测试3.2 YOLOv5 engine 速度测试3.3 YOLOv6 …

代码随香录算法训练营day16 | 104. 二叉树的最大深度,559. N 叉树的最大深度,111. 二叉树的最小深度,222. 完全二叉树的节点个数

目录 104. 二叉树的最大深度 559. N 叉树的最大深度 111. 二叉树的最小深度 222. 完全二叉树的节点个数 104. 二叉树的最大深度 学了回溯之后再来做一下 思路&#xff1a; 二叉树节点的深度&#xff1a;指从根节点到该节点的最长简单路径边的条数或者节点数&#xff08;取…

chatgpt 接口使用(一)

使用api实现功能 参考链接&#xff1a;https://platform.openai.com/examples 安装库&#xff1a; pip3 install openai 例如&#xff1a; import os import openaiopenai.api_key os.getenv("OPENAI_API_KEY") response openai.ChatCompletion.create(model&q…

Flutter:使用url_launcher打开外部浏览器、拨打电话、发送短信、打开第三方app、打开应用商店下载应用

前言 Flutter中的url_launcher是一个用于打开URL的插件。它允许在Flutter应用程序中打开网址、发送电子邮件、拨打电话等操作。使用url_launcher插件&#xff0c;可以轻松地在应用程序中集成各种URL操作。 官方地址 https://pub-web.flutter-io.cn/packages/url_launcher 安…

Oracle 时间多少秒以后 oracle interval 多少分钟之前 Oracle日期1小时后 Java时间多少秒以后 Java日期多少天之前

Oracle 时间多少秒以后 oracle interval 多少分钟之前 Oracle日期1小时后 Java时间多少秒以后 Java日期多少天之前 一、概述 在项目开发中&#xff0c;遇到一个类似于 超时关闭的订单&#xff08;超过1分钟后关闭订单&#xff09; 的需求&#xff0c;在数据的时间写入时&#x…

【Python机器学习】实验06 KNN最近邻算法

文章目录 KNN算法前言 距离度量(1) 欧式距离(2) 曼哈顿距离(Manhattan distance)(3) 切比雪夫距离(Chebyshev distance)(4) 闵可夫斯基距离(Minkowski distance)(5) 汉明距离(Hamming distance)(6) 余弦相似度(Cosine Similarity) KNN算法介绍1 数据的准备2 划分训练数据和测试…

C++11 线程库

1 thread类的简单介绍 在C11之前&#xff0c;涉及到多线程问题&#xff0c;都是和平台相关的&#xff0c;比如windows和linux下各有自己的接口&#xff0c;这使得代码的可移植性比较差。C11中最重要的特性就是对线程进行支持了&#xff0c;使得C在并行编程时不需要依赖第三方库…

利用AI倾听熊猫爱的声音,预测交配成功

大熊猫是世界上最受喜爱的动物之一。原产于中国中部和西南部的山脉&#xff0c;具有独特的黑眼睛和黑白外套的熊于1990年被列入国际自然保护联盟&#xff08;IUCN&#xff09;濒危名单。它们的地位在2016年升级为易危物种&#xff0c;世界自然基金会估计现在大约有1&#xff0c…

计算机视觉常用数据集介绍

1 MINIST MINIST 数据集应该算是CV里面最早流行的数据了&#xff0c;相当于CV领域的Hello World。该数据包含70000张手写数字图像&#xff0c;其中60000张用于train&#xff0c; 10000张用于test&#xff0c; 并且都有相应的label。图像的尺寸比较小&#xff0c; 为28x28。 数…

QTableWidget setSortingEnable 函数使用详解

Qt助手的解释 If enable is true, enables sorting for the table and immediately trigger a call to sortByColumn() with the current sort section and order Note: Setter function for property sortingEnabled. 如果将 enable 设置为 true 那么就会立即调用 sortByColum…

真正帮你实现—MapReduce统计WordCount词频,并将统计结果按出现次数降序排列

项目整体介绍 对类似WordCount案例的词频统计&#xff0c;并将统计结果按出现次数降序排列。 网上有很多帖子&#xff0c;均用的相似方案&#xff0c;重写某某方法然后。。。运行起来可能会报这样那样的错误&#xff0c;这里实现了一种解决方案&#xff0c;分享出来供大家参考…

DHCP防护原理

电脑刚连接到网络 是没有IP地址的 。 通过发送广播到DHCPO服务器。 DHCP服务器响应对应的 IP地址&#xff08;简要过程&#xff09;。 如果有人私自挂接WIFI&#xff0c;相当于DHCP服务器&#xff0c;但这个DHCP服务器是假的&#xff0c;就会引起电脑接入获取家用WIFI的地址&…

十三.redis主从复制

概念 主从复制&#xff0c;指将一台redis服务器的数据&#xff0c;复制到其它的redis服务器。前者称为主节点(master)&#xff0c;后者称为从节点(slave)&#xff1b;数据的复制是单向的&#xff0c;只能由主节点到从节点。master以写为主&#xff0c;slave以读为主。 默认情况…

小研究 - 面向 Spring 的热点代码在线部署方法研究(三)

随着Spring生态不断发展,越来越先进的部署方式降低了部署的复杂度,提高了不同环境下的部署效率,但是在预生产环境下,对频繁改动的热点代码,其部署效率不是很理想,一些简单的代码修改就会引发对所有依赖服务的重新编译部署,给项目部署、运维以及测试带来很多预期之外的影响。在线…

设计模式再探——代理模式

目录 一、背景介绍二、思路&方案三、过程1.代理模式简介2.代理模式的类图3.代理模式代码4.代理模式还可以优化的地方5.代理模式的项目实战&#xff0c;优化后(只加了泛型方式&#xff0c;使用CGLIB的代理) 四、总结五、升华 一、背景介绍 最近在做产品过程中对于日志的统一…

【Git】分支管理之创建、切换、合并、删除分支以及冲突处理

目录 一、理解分支 二、创建、切换、合并分支 三、删除分支 四、冲突处理 五、合并模式 六、合并策略 七、Bug分支处理 八、强制删除分支 一、理解分支 master其实就是一个指针 &#xff0c;他指向的是主分支最近一次commit。我们可以创建新的分支&#xff0c;在新的分…

antv x6将节点拖动到两连线的节点中,自动插入

1、找到节点相交的边 /*** * 将节点拖入两节点之间自动插入【找相交的边】* date 2023-07-29*/export const findIntersectsEdge (graph, node) > {const edges graph.getEdges();const bbox node.getBBox();const lines [bbox.leftLine, bbox.rightLine, bbox.topLine…

《零基础入门学习Python》第073讲:GUI的终极选择:Tkinter10

我们不难发现&#xff0c;几乎每一个应用程序都有一些相同的地方&#xff0c;比如说&#xff1a;标题栏、状态栏、边框、滚动条、工作区。还有的就是 菜单。 传统的菜单有大家熟悉的 File&#xff0c;Edit&#xff0c;Help等&#xff0c;点开之后&#xff0c;是下拉菜单&#…