【css3】涟漪动画

效果展示

dom代码

<div class="mapSelfTitle66"><div></div>
</div>

样式代码

.mapSelfTitle66{width:120px;height:60px;position: relative;&>div{width:100%;height:100%;background: url("~@/assets/images/video_show/error_bg.png") no-repeat;background-size: 100% 100%;position: absolute;top:50%;left:50%;margin:-30px 0 0 -60px;animation: animationName 1.5s ease-out infinite;}
}
@keyframes animationName {0% { }100% {width:140px;height:70px;margin:-35px 0 0 -70px;}
}

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

怎么扫码下载视频?一招生成可下载的视频二维码

怎么做可以下载视频的二维码呢&#xff1f;当我们用二维码来分享时&#xff0c;很多视频二维码生成器制作的二维码都只有展示功能&#xff0c;无法让扫码者选择下载视频&#xff0c;那么这个问题有什么解决方法呢&#xff1f;对于有这方面需求的小伙伴&#xff0c;小编可以给大…

计算机视觉 计算机视觉识别是什么?

计算机视觉识别&#xff08;Computer Vision Recognition&#xff09;是计算机科学和人工智能领域中的一个重要分支&#xff0c;它致力于使计算机系统能够模拟和理解人类视觉的过程&#xff0c;从而能够自动识别、分析和理解图像或视频中的内容。这一领域的发展旨在让计算机具备…

Nginx常见问题解决

一、修改nginx.conf报错 背景&#xff1a;修改nginx.conf&#xff0c;配置转发到tcp的信息&#xff1a; 在stream块中配置转发规则&#xff1a;在stream块中&#xff0c;使用server指令来配置转发规则。例如&#xff0c;如果你要将TCP流量转发到example.com:1234&#xff0c;可…

Microsoft Edge不能工作了,可能原因不少,那么如何修复呢

Microsoft Edge打不开或不能加载网页是用户在Windows 10、Android、Mac和iOS设备上的网络浏览器上遇到的许多错误之一。其他Microsoft Edge问题可能包括浏览器窗口和选项卡冻结、网站崩溃、互联网连接错误消息以及丢失Microsoft Edge书签、收藏夹、密码和收藏。 Microsoft Edg…

【Nginx37】Nginx学习:SSL模块(一)简单配置与指令介绍

Nginx学习&#xff1a;SSL模块&#xff08;一&#xff09;简单配置与指令介绍 又是一个重点模块&#xff0c;SSL 模块&#xff0c;其实就是我们常见的 HTTPS 所需要的配置模块。HTTPS 的重要性不用多说了吧&#xff0c;现在所有的 App、小程序 都强制要求是 HTTPS 的&#xff0…

STM32-RTC实时时钟

目录 RTC实时时钟 功能框图 UNIX时间戳 初始化结构体 RTC时间结构体 RTC日期结构体 RTC闹钟结构体 进入和退出配置函数 实验环节1&#xff1a;显示日历 常规配置 RTC配置 测试环节 实验现象 实验环节2&#xff1a;闹钟 常规配置 RTC配置 测试环节 实验现象 R…

致远OA wpsAssistServlet任意文件读取漏洞复现 [附POC]

文章目录 致远OA wpsAssistServlet任意文件读取漏洞复现 [附POC]0x01 前言0x02 漏洞描述0x03 影响版本0x04 漏洞环境0x05 漏洞复现1.访问漏洞环境2.构造POC3.复现 0x06 修复建议 致远OA wpsAssistServlet任意文件读取漏洞复现 [附POC] 0x01 前言 免责声明&#xff1a;请勿利用…

lua-web-utils库

lua--导入所需的库local web_utilsrequire("lua-web-utils")--定义要下载的URLlocal url"https://jshk.com.cn/"--定义代理服务器的主机名和端口号local proxy_port8000--使用web_utils的download函数下载URLlocal file_pathweb_utils.download(url,proxy_…

HALCON的综合应用案例【01】: 3D 算法处理在 Visual Studio 2019 C# 环境中的集成实例

前言: HALCON 为一款比较流行的商业视觉处理软件,他提供了多种开发的模式,可以在HALCON中开发,也可以将HALCON的设计通过导出库的形式集成到其他开发环境里面,以方便系统集成。本文为笔者自己的一个3D 视觉检测项目,利用HALCON的3D 库开发算法,然后,将算法集成到 MS-V…

力扣每日一题92:反转链表||

题目描述&#xff1a; 给你单链表的头指针 head 和两个整数 left 和 right &#xff0c;其中 left < right 。请你反转从位置 left 到位置 right 的链表节点&#xff0c;返回 反转后的链表 。 示例 1&#xff1a; 输入&#xff1a;head [1,2,3,4,5], left 2, right 4 输…

VS Code 开发Java之代码导航和代码编辑

快速导航 VS Code提供了一些功能可以在Java开发时快速导航。 代码导航 大纲视图&#xff08;Outline view&#xff09;&#xff1a; 方便地导航当前文件中的成员项目视图&#xff08;Projects view&#xff09;&#xff1a; 项目的详细概述Java编辑器&#xff1a; 支持调用层…

你担心spring容器中scope为prototype的bean太大内存溢出吗?

你担心spring容器中scope为prototype的bean太大内存溢出吗&#xff1f; 提出假设 之前一直担心spring的scope为prototype的bean在一些高并发的场景下&#xff0c;吃不消吗&#xff0c;甚至会内存溢出&#xff0c;这样的担心不是没有道理的&#xff0c;&#xff08;以下是假设…