两个gif图片动画效果
<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图片动画效果的更多相关文章
- 基于html5页面滚动背景图片动画效果
基于html5页面滚动背景图片动画效果是一款带索引按钮的页面滚动动画特效代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div id="fullpage&q ...
- 多种方法实现H5网页图片动画效果;
在web开发中,GIF动画效果是随处可见,比如常见的loading加载.人物奔跑的gif图片等等,那么这些都是怎么实现的呢?其实实现的原理很简单,简而言之,这些所谓的动画都是一帧一帧的图片经过一段时间 ...
- css实现图片动画效果
需求 项目里有个消息中心,当有消息的时候,小铃铛图标可以晃两下,提示当前有信息. 实现过程 书写css 使用css的keyframe属性,配合animation. @keyframes ringing ...
- 纯CSS3实现GIF图片动画效果
在线演示 本地下载
- 【转】C#窗体飞入飞出的动画效果(Api)
[System.Runtime.InteropServices.DllImport("user32")] private static extern bool AnimateWin ...
- app引导页(背景图片切换加各个页面动画效果)
前言:不知不觉中又加班到了10点半,整个启动页面做了一天多的时间,一共有三个页面,每个页面都有动画效果,动画效果调试起来麻烦,既要跟ios统一,又要匹配各种不同的手机,然后产品经理还有可能在中途改需求 ...
- JQuery图片切换动画效果
由于博主我懒,所以页面画的比较粗糙,但是没关系,因为我主要讲的是如何实现图片动画切换. 思路:想必大家都逛过淘宝或者其他的一些网站,一般都会有图片动画切换的效果,那是怎样实现的呢?博主我呢,技术不是很 ...
- 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 ...
- [原创]实现android知乎、一览等的开场动画图片放大效果
代码下载地址: https://github.com/Carbs0126/AutoZoomInImageView 知乎等app的开场动画为:一张图片被显示到屏幕的正中央,并充满整个屏幕,过一小段时间后 ...
随机推荐
- NPVariant -js传递给NPAPI插件参数在firefox和chrome需要采用不同的获取方式
原帖地址:http://blog.sina.com.cn/s/blog_4c6631790102wd1o.html 整数参数 typedef struct _NPVariant { NPVariant ...
- vim脚本判断操作系统
Linux 和 Windows 通用配置 其实在配置文件中是可以通过逻辑代码判断平台做条件处理的,这样就可以实现一个配置文件两个个平台下共用了,判断逻辑如下: " ============= ...
- linux下phpmailer发送邮件出现SMTP ERROR: Failed to connect to server: (0)错误
转自:https://www.cnblogs.com/raincowl/p/8875647.html //Create a new PHPMailer instance $mail = new PHP ...
- 【转载】 卷积神经网络(Convolutional Neural Network,CNN)
作者:wuliytTaotao 出处:https://www.cnblogs.com/wuliytTaotao/ 本作品采用知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议进行许可,欢迎 ...
- ES6深入浅出-8 新版的类(下集)-2.全部语法
解答提问 两边都没有构造函数的情况 父类没有构造函数,子类有构造函数的情况 下面用到的了this.body这个属性,所以super()必须要放在这行代码的上面. 在调用this之前必须调用super( ...
- 【微信开发】微信小程序通过经纬度计算两地距离php代码实现
需求: 要求做个根据用户当前位置获取周围商家地址,并且按照由近到远排序, 方法一: 代码层实现 封装方法: /** * @desc 根据两点间的经纬度计算距离 * @param float $lat ...
- windows10 环境下的amqp安装步骤(图文)
安装PHP扩展ampq 查看phpinfo()信息 下载ampq扩展 下载地址:http://pecl.php.net/package/amqp 选择一个dll版本下载,本文选择的是1.9.3 自己根 ...
- Linux系统调优——磁盘I/O(三)
(1).查看I/O运行状态相关工具 1)查看文件系统块大小 对于ext4文件系统,查看文件系统块大小 [root@CentOS6 ~]# tune2fs -l /dev/sda1 | grep siz ...
- window下安装docker
下载docker toolbox https://mirrors.aliyun.com/docker-toolbox/windows/docker-toolbox/ 1,.双击安装DockerTool ...
- SpringBoot学习笔记:自定义拦截器
SpringBoot学习笔记:自定义拦截器 快速开始 拦截器类似于过滤器,但是拦截器提供更精细的的控制能力,它可以在一个请求过程中的两个节点进行拦截: 在请求发送到Controller之前 在响应发送 ...