宝哥软件园

vue初始化动画加载的实例

编辑:宝哥软件园 来源:互联网 时间:2021-08-30

1.在入口文件index.html中加入装货动画:

!DOCTYPE html html head meta charset=' utf-8 ' meta name=' renderer ' content=' web kit | ie-comp | ie-stand ' meta content=' width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0' name='viewport '!-浏览器兼容模式用最新的文档渲染模式-meta http-equiv=' X-UA-Compatible '内容=' IE=edge/title/title样式类型=' text/CSS ' # Loading { top :50%;左侧:50%;绝对位置:-web套件-transform : translateY(-50%)translateX(-50%);transform : translateY(-50%)translateX(-50%);z指数:100;} @-网络工具包-关键帧击球率{ 50% { opa city 3360 0.2;-webkit-transform:刻度(0.75);变压器:刻度(0.75);} 100% { opa city 3360 1;-webkit-transform:秤(1);变压器:比例尺(1);} } @关键帧击球率{ 50% { opa city 3360 0.2;-webkit-transform:刻度(0.75);变压器:刻度(0.75);} 100% { opa city 3360 1;-webkit-transform:秤(1);变压器:比例尺(1);} } .背景色: # 279 CFF;宽度: 15px高度: 15pxborder-radius: 100%!重要;margin : 2px-网络套件-动画-填充-mode:两者;动画-填充-模式:两者;显示器:内联块;-网络套件-动画:拍0.7s 0s无限线性;动画:球拍0.7s 0s无限线性;} .球拍div : th-child(2n-1){-WebKit-动画-延迟: 0.35s!重要;动画-延迟:0.35秒!重要;}/style/head body div id=' Loading ' div class=' loader-内球-beat ' div/div/div/div/div id=' app '/div!自建文件将自动注入- /body/html2 .在app.vue的创造方法中:

已创建(){文档。尸体。移除子文档。getelementbyid(' Loading ')效果如下:

以上这篇某视频剪辑软件初始化动画加载的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

更多资讯
游戏推荐
更多+