vue实现设置载入动画和初始化页面动画效果


Posted in Javascript onOctober 28, 2019

移动端页面载入时过长的白屏等待,总是让人心烦气躁

不如,加个小动画吧

原理很简单

在index.html页面的body插入一个div

css里写入动画

在app.vue里 created的时候 将这个div移除就ok了

index.html

vue实现设置载入动画和初始化页面动画效果

CSS

vue实现设置载入动画和初始化页面动画效果

app.vue

vue实现设置载入动画和初始化页面动画效果

最终效果

vue实现设置载入动画和初始化页面动画效果

以上这篇vue实现设置载入动画和初始化页面动画效果就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery maxlength文本字数限制插件
Apr 16 Javascript
基于Jquery 解决Ajax请求的页面 浏览器后退前进功能,页面刷新功能实效问题
Dec 11 Javascript
jQuery当鼠标悬停时放大图片的效果实例
Jul 03 Javascript
JQuery实现简单的图片滑动切换特效
Nov 22 Javascript
vue-resourse将json数据输出实例
Mar 08 Javascript
JS解决移动web开发手机输入框弹出的问题
Mar 31 Javascript
xmlplus组件设计系列之分隔框(DividedBox)(8)
May 02 Javascript
原生JavaScript实现精美的淘宝轮播图效果示例【附demo源码下载】
May 27 Javascript
详解使用vue实现tab 切换操作
Jul 03 Javascript
vue刷新和tab切换实例
Feb 11 Javascript
vue展示dicom文件医疗系统的实现代码
Aug 27 Javascript
深入了解JavaScript代码覆盖
Jun 13 Javascript
vue设置一开始进入的页面教程
Oct 28 #Javascript
Vue调用后端java接口的实例代码
Oct 28 #Javascript
原生js实现商品筛选功能
Oct 28 #Javascript
使用Vue实现调用接口加载页面初始数据
Oct 28 #Javascript
JavaScript制作3D旋转相册
Aug 02 #Javascript
微信小程序工具函数封装
Oct 28 #Javascript
js实现3D照片墙效果
Oct 28 #Javascript
You might like
php设计模式 Mediator (中介者模式)
2011/06/26 PHP
PHP防CC攻击实现代码
2011/12/29 PHP
Zend Framework教程之路由功能Zend_Controller_Router详解
2016/03/07 PHP
php+Memcached实现简单留言板功能示例
2017/02/15 PHP
Laravel统计一段时间间隔的数据方法
2019/10/09 PHP
用jscript实现新建word文档
2007/06/15 Javascript
js单例模式的两种方案
2013/10/22 Javascript
Express作者TJ告别Node.js奔向Go
2014/07/14 Javascript
深入探密Javascript数组方法
2015/01/08 Javascript
微信小程序侧边栏滑动特效(左右滑动)
2017/01/23 Javascript
Three.js利用orbit controls插件(轨道控制)控制模型交互动作详解
2017/09/25 Javascript
VUE element-ui 写个复用Table组件的示例代码
2017/11/18 Javascript
vue 点击展开显示更多(点击收起部分隐藏)
2019/04/09 Javascript
turn.js异步加载实现翻书效果
2019/07/25 Javascript
解决antd 表单设置默认值initialValue后验证失效的问题
2020/11/02 Javascript
JavaScript实现京东快递单号查询
2020/11/30 Javascript
JavaScript实现消消乐的源代码
2021/01/12 Javascript
Python中的tuple元组详细介绍
2015/02/02 Python
Python中用sleep()方法操作时间的教程
2015/05/22 Python
Python的Flask框架中使用Flask-SQLAlchemy管理数据库的教程
2016/06/14 Python
tensorflow 用矩阵运算替换for循环 用tf.tile而不写for的方法
2018/07/27 Python
python面向对象 反射原理解析
2019/08/12 Python
Python+OpenCV实现实时眼动追踪的示例代码
2019/11/11 Python
python实现遍历文件夹图片并重命名
2020/03/23 Python
终于搞懂了Keras中multiloss的对应关系介绍
2020/06/22 Python
如何利用python正则表达式匹配版本信息
2020/12/09 Python
python利用appium实现手机APP自动化的示例
2021/01/26 Python
基于 HTML5 WebGL 实现的垃圾分类系统
2019/10/08 HTML / CSS
Subside Sports德国:足球球衣和球迷商品
2019/06/08 全球购物
小饰品店的创业计划书范文
2013/12/28 职场文书
销售心得体会
2014/01/02 职场文书
大学生怎样写好自荐信
2014/02/25 职场文书
吨的认识教学反思
2014/04/27 职场文书
2014年领导班子工作总结
2014/12/11 职场文书
win10频率超出范围怎么办?win10老显示超出工作频率范围的解决方法
2022/07/07 数码科技
Centos7 Shell编程之正则表达式、文本处理工具详解
2022/08/05 Servers