<div className="uploading-animation-tip-wrap">
<img src={require('~/shared/assets/image/slide-uploading-animation-file-300-300.gif')} alt="" className="uploading-tip-animation-file" />
<img src={require('~/shared/assets/image/slide-uploading-animation-progress-wave-300-300.gif')} alt="" className="uploading-tip-animation-progress" />
</div>
.uploading-animation-tip-wrap {
width: 66px;
height: 66px;
background-color: #f5f5f5;
border-radius: 50%;
position: relative; .uploading-tip-animation-file {
width: 66px;
position: absolute;
top:;
left:;
z-index:;
}
.uploading-tip-animation-progress {
width: 66px;
position: absolute;
top:;
left:;
z-index:;
opacity: 0.2;
}
}

两个gif图片动画效果的更多相关文章

  1. 基于html5页面滚动背景图片动画效果

    基于html5页面滚动背景图片动画效果是一款带索引按钮的页面滚动动画特效代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="fullpage&q ...

  2. 多种方法实现H5网页图片动画效果;

    在web开发中,GIF动画效果是随处可见,比如常见的loading加载.人物奔跑的gif图片等等,那么这些都是怎么实现的呢?其实实现的原理很简单,简而言之,这些所谓的动画都是一帧一帧的图片经过一段时间 ...

  3. css实现图片动画效果

    需求 项目里有个消息中心,当有消息的时候,小铃铛图标可以晃两下,提示当前有信息. 实现过程 书写css 使用css的keyframe属性,配合animation. @keyframes ringing ...

  4. 纯CSS3实现GIF图片动画效果

    在线演示 本地下载

  5. 【转】C#窗体飞入飞出的动画效果(Api)

    [System.Runtime.InteropServices.DllImport("user32")] private static extern bool AnimateWin ...

  6. app引导页(背景图片切换加各个页面动画效果)

    前言:不知不觉中又加班到了10点半,整个启动页面做了一天多的时间,一共有三个页面,每个页面都有动画效果,动画效果调试起来麻烦,既要跟ios统一,又要匹配各种不同的手机,然后产品经理还有可能在中途改需求 ...

  7. JQuery图片切换动画效果

    由于博主我懒,所以页面画的比较粗糙,但是没关系,因为我主要讲的是如何实现图片动画切换. 思路:想必大家都逛过淘宝或者其他的一些网站,一般都会有图片动画切换的效果,那是怎样实现的呢?博主我呢,技术不是很 ...

  8. jQuery演示10种不同的切换图片列表动画效果以及tab动画演示 2

    很常用的一款特效纯CSS完成tab实现5种不同切换对应内容效果 实例预览 下载地址 实例代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 ...

  9. [原创]实现android知乎、一览等的开场动画图片放大效果

    代码下载地址: https://github.com/Carbs0126/AutoZoomInImageView 知乎等app的开场动画为:一张图片被显示到屏幕的正中央,并充满整个屏幕,过一小段时间后 ...

随机推荐

  1. CESIUM内置shader变量和函数[转]

    cesium中内置了一些常量.变量和函数,在vs和fs中可直接使用. 内置uniform 内置uniform主要置于AutomaticUniforms类里面,该类私有未开放文档. czm_backgr ...

  2. android studio: 对齐成员变量及链式方法

    "File"-"Settings"-"Editor"-"Java"-"Wrapping and Braces& ...

  3. 解决Wireshark安装Npcap组件失败

    解决Wireshark安装Npcap组件失败   从Wireshark 3.0开始,Npcap取代Winpcap组件,成为Wireshark默认的网卡核心驱动.由于该组件属于驱动程序,所以安装时候容易 ...

  4. yii2增删改查操作

    https://www.yiichina.com/tutorial/996 https://www.yiichina.com/tutorial/834 一.新增 使用model::save()操作进行 ...

  5. Qt编写气体安全管理系统10-数据导出

    一.前言 数据导出一般指导出到excel表格,可能有部分用户还需要导出到pdf,因为pdf基本上不可编辑,防止用户重新编辑导出的数据,excel可能绝大部分用过电脑的人都知道,广为流行,主要就是微软的 ...

  6. ISCSI多路径配置(二)

    搭建iscsi存储系统(一) (1).配置ISCSI多路径实现磁盘挂载高可用 如果存储服务器到交换机只有一条线路的时候,那么一条线路出现故障,整个就没法使用了,所以多线路可以解决这个问题,避免单点故障 ...

  7. shell脚本中执行mysql sql脚本文件并传递参数

    1 shell 文件内容替换 sed是一个很好的文件处理工具,本身是一个管道命令,主要是以行为单位进行处理,可以将数据行进行替换.删除.新增.选取等特定工作,下面先了解一下sed的用法. 调用sed命 ...

  8. .gitignore 模板

    .gitignore 模板 HELP.md target/ !.mvn/wrapper/maven-wrapper.jar !**/src/main/** !**/src/test/** ### ST ...

  9. [转]C++ STL中的Binary search(二分查找)

    链接地址:https://www.cnblogs.com/wkfvawl/p/9475939.html

  10. 《第一本Docker书》学习笔记——第3章 Docker入门

    3.1 确保Docker已经就绪 查看docker是否正常工作: sudo docker info 3.2 运行我们的第一个容器 现在,让我们尝试启动第一个Docker容器.我们可以使用docker ...