前端小程序 实现文字加载效果 文字跳动

news2024/12/28 17:42:01

效果

主要看充电中...的效果
![1请添加图片描述

实现

<view v-else class="status-working">
							<text class="letter letter1"></text>
							<text class="letter letter2"></text>
							<text class="letter letter3"></text>
							<text class="letter letter4">.</text>
							<text class="letter letter5">.</text>
							<text class="letter letter6">.</text>

						</view>
@keyframes letter {
				0% {
					top: 0;
				}

				50% {
					top: -5rpx;
				}

				100% {
					top: 0rpx;
				}
			}

			.status-working {
				.letter {
					position: relative;
					animation: letter 3s infinite;
				}

				.letter1 {
					animation-delay: 0s;
				}

				.letter2 {
					animation-delay: -0.8s;
				}

				.letter3 {
					animation-delay: -0.6s;
				}

				.letter4 {
					animation-delay: -0.3s;
				}

				.letter5 {
					animation-delay: -0.2s;
				}

				.letter6 {
					animation-delay: -0.1s;
				}
			}

		}

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

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

相关文章

二十二、Arcpy批量波段组合——结合Landat数据城市建成区提取

一、前言 其实波段组合和GIS中栅格计算有点类似,实质上就是对每个像素点对应的DN值进行数学计算,也就是可以进行运算表达式是三个或多个变量相加、相减……每一个变量对应于一个图像数据,对这三个或多个图像数据求值并输出结果图像。 二、具体操作 1、实验具体目标 将202…

Android WMS——WMS窗口添加(十)

Android 的 WMS&#xff08;Window Manager Service&#xff09;是一个关键组件&#xff0c;负责管理窗口的创建、显示、布局和交互等。Window 的操作有两大部分&#xff0c;一部分是 WindowManager 来处理&#xff0c;一部分是 WMS 来处理&#xff0c;如下图所示&#xff1a; …

验收测试的关键步骤是怎样的?

验收测试是项目管理中的一个关键步骤&#xff0c;旨在确保项目交付物(通常是软件、产品或服务)符合预期的质量标准和需求。这个过程有助于验证项目的可交付成果是否满足客户或利益相关者的期望&#xff0c;同时也为项目团队提供了机会来修复可能存在的问题和改进之前的工作。 一…

一个方法,教你快速监测蓄电池!

随着电力需求的不断增长和可再生能源的快速发展&#xff0c;蓄电池技术已经成为能源存储领域的重要组成部分。 蓄电池不仅在家庭和工业应用中发挥着重要作用&#xff0c;还在电网稳定性和可持续能源集成方面具有关键地位。然而&#xff0c;蓄电池的有效监控和管理对于确保其可靠…

【Qt控件之QMessageBox】详解

Qt控件之QMessageBox 描述基于属性的API富文本和文本格式属性严重程度以及图标和Pixmap属性静态函数API 高级用法默认按钮和退出按钮示例使用场景 描述 QMessageBox类提供了一个模态对话框&#xff0c;用于通知用户或向用户提问并接收答案。 消息框显示一个主要文本以提醒用户…

软件测试 —— 冒烟测试(Smoke Test,ST)

1. 核心 冒烟测试就是完成一个新版本的开发后&#xff0c;对该版本最基本的功能进行测试&#xff0c;保证基本的功能和流程能走通。 如果不通过&#xff0c;则打回开发那边重新开发&#xff1b; 如果通过测试&#xff0c;才会进行下一步的测试(功能测试&#xff0c;集成测试&a…

SQLyog连接数据库报plugin caching_sha2_password could not be loaded......解决方案

问题描述 问题分析 因为MySQL新版默认使用caching_sha2_password作为身份验证的插件&#xff0c;而旧版本使用的是mysql_native_password。当出现plugin caching_sha2_password could not be loaded报错&#xff0c;我们更换为旧版本 如何解决 先使用cmd命令登录MySQL&a…

从零开始的LINUX(四)

1.yum&#xff1a; 功能&#xff1a;软件包管理器&#xff0c;功能类似与手机上的应用商店。通过yum可以获取指令的下载地址&#xff0c;然后一键式安装指令。由于yum中的地址一般都是外网的&#xff0c;所以需要镜像源&#xff08;即国内的下载地址&#xff09;。 相关指令&…

2023最网最全软件测试基础知识【建议收藏】

​对于一个软件来说&#xff0c;总会存在各种各样的软件缺陷。因此我们需要通过软件测试来检查软件中存在的各种问题。 在下面的这篇文章中&#xff0c;将讲解软件测试的基础知识&#xff0c;让我们一起来了解一下吧 一、 软件缺陷的概述 1、什么是软件缺陷 ​ 软件缺陷就是…

博弈论学习笔记(3)——完全信息动态博弈

前言 在这个部分&#xff0c;我们学习的是完全信息动态博弈。主要内容包括扩展式博弈、子博弈精炼Nash均衡、重复博弈和子博弈精炼Nash均衡的应用。 一、扩展式博弈 1、扩展式博弈 1&#xff09;扩展式博弈是什么 扩展式博弈是博弈问题的一种规范性描述&#xff0c;扩展式博…

【MATLAB源码-第64期】matlab基于DWA算法的机器人局部路径规划包含动态障碍物和静态障碍物。

操作环境&#xff1a; MATLAB 2022a 1、算法描述 动态窗口法&#xff08;Dynamic Window Approach&#xff0c;DWA&#xff09;是一种局部路径规划算法&#xff0c;常用于移动机器人的导航和避障。这种方法能够考虑机器人的动态约束&#xff0c;帮助机器人在复杂环境中安全、…

java面向对象编程高级

1、static修饰符 1.1static修饰成员变量 static叫静态&#xff0c;可以修饰成员变量、成员方法 成员变量按照有无static修饰&#xff0c;分为两种 类变量 : 有static修饰&#xff0c;属于类&#xff0c;在计算机里只有一份&#xff0c;会被类的全部对象共享 在开发中&#…

处理固定资产折旧报错 AFAB “根据记帐循环, 您必须接下来对期间 001记帐”

会计在运用进行固定资产折旧时&#xff0c;发现有个报错“根据记帐循环, 您必须接下来对期间 001记帐”&#xff0c; 根据记帐循环, 您必须接下来对期间 001记帐 消息编号 AA683 诊断 不可以在指定的期间过帐折旧&#xff0c;因为此操作会遗漏过帐期间。 系统响应 该期间不能进…

Nginx域名重定向(如何访问的域名和实际的数据请求路径不同,可解决前端跨域)

感情需要被抑制&#xff0c;不能泛滥… 当需要将一个域名重定向到另一个域名并且用户仍然看到原始域名时&#xff0c;Nginx是一个强大的工具。这种场景通常涉及到反向代理或重写URL的技巧。在本篇博客中&#xff0c;我们将详细介绍如何使用Nginx来实现这个目标&#xff0c;以及…

SPSS两独立样本t检验

前言&#xff1a; 本专栏参考教材为《SPSS22.0从入门到精通》&#xff0c;由于软件版本原因&#xff0c;部分内容有所改变&#xff0c;为适应软件版本的变化&#xff0c;特此创作此专栏便于大家学习。本专栏使用软件为&#xff1a;SPSS25.0 本专栏所有的数据文件请点击此链接下…

VOD: 视频共享点播服务实现

目录 一.项目背景及原理 1.背景 2.原理 二.技术栈及项目环境 1.技术栈 2.项目环境 三. 模块划分 四.遇到的问题及其解决方法 1.查询视频模糊匹配问题 2.前端界面的修改 五.项目预览 六. 最终版代码 前言: 这里实现一个视频点播服务, 可以用来上传视频, 下载视频, 删…

springboot读取application.properties中文乱码问题

目录 1 前言&#xff1a; 2 本地环境中的解决方案&#xff08;以idea为例&#xff09; 3 全部解决方案 1 前言&#xff1a; 初用properties,读取java properties文件的时候如果value是中文&#xff0c;会出现乱码的问题。我们首先需要明了乱码问题的根源。在 Java 中&#x…

基于jsp,ssm物流快递管理系统

开发工具&#xff1a;eclipse&#xff0c;jdk1.8 服务器&#xff1a;tomcat7.0 数据库&#xff1a;mysql5.7 技术&#xff1a; springspringMVCmybaitsEasyUI 项目包括用户前台和管理后台两部分&#xff0c;功能介绍如下&#xff1a; 一、用户(前台)功能&#xff1a; 用…

Servlet 上下文参数

7)Servlet上下文对象&#xff1a;ServletContext生活中的例子&#xff1a;张三和李四在不远处窃窃私语&#xff0c;并且频繁的对着你坏笑。你肯定会跑过去问&#xff1a;你们俩在聊什么&#xff1f;注意&#xff1a;此处的聊什么&#xff0c;其实就是你在咨询他们聊天的上下文&…

九河云多云管理平台优劣势分析,使用评测!

多数情况下&#xff0c;仅依靠公有云不足以支撑企业发展。企业的某些特定需求还需要继续依赖私有云和传统IT服务。混合、多云架构往往是企业的唯一选择&#xff0c;但其设置和运行却非常复杂&#xff0c;为了管理混合架构&#xff0c;大多数企业已逐步转向多云模式&#xff0c;…