.swiper-animate {
position: absolute;
width: 100%;
height: 100%;
left:;
top:;
z-index:;
background: linear-gradient(to bottom, transparent, #3e88f1);
animation: scan 1.5s ease-in-out infinite;
-webkit-animation: scan 1.5s ease-in-out infinite;
} @keyframes scan {
from {
top: -667px;
}/*网格移动到显示区域的外面*/
to {
top:;
}
} @-webkit-keyframes scan {
from {
top: -667px;
}
to {
top:;
}
}

CSS3扫描动画效果的更多相关文章

  1. 测试css3的动画效果在display:none的时候不耗费性能

    也许你也有这个疑惑,动画一直在播放,那它不显示出来的时候也一直在播放的话,那是否一直占用资源呢? <!doctype html> <html> <head> < ...

  2. css3 transform动画效果与公司框架简易动画的差异

    先看一下该网站的效果 http://2014guangzhouchezhan.dongfeng-citroen.com.cn/mobile/ 该站里面的动画效果由简易动画与css3动画2种方式混合达到 ...

  3. css3实现动画效果

    一.动画效果的常用属性 实现动画效果需要借助css3的下列属性:transform,transion,animation(具体可以参见教材) 二.动画效果实例 1)文字闪烁的动画效果 /*文字的闪烁效 ...

  4. 纯CSS3带动画效果导航菜单

    随着互联网的发展,网页能表现的东西越来越多.由最开始单纯的文字和链接构成的网页,到后来的表格布局,再到div+css模式,现在发展到了html+css3.网页能表达的东西越来越多,css3兴起已经很多 ...

  5. CSS3新动画效果

    CSS3添加了几个动画效果的属性,通过设置这些属性,可以做出一些简单的动画效果而不需要再去借助JavaScript.CSS3动画的属性主要分为三类:transform.transition以及anim ...

  6. css3的动画效果

    全新的css3加入的动画效果: [ animation-name ]:检索或设置对象所应用的动画名称 [ animation-duration ]: 检索或设置对象动画的持续时间 [ animatio ...

  7. CSS3悬浮动画效果

    利用CSS3的伪类元素hover以及transform,transition等动画属性,可以做出一些炫酷的动画效果.下面将一些项目中使用到的示例发布出来,供大家一起学习研究.演示地址:runjs. 浏 ...

  8. 初识css3 3d动画效果

    (先看我博客右上角的3d盒子动画效果,目前没做兼容处理,最好最新的chrome看)无意间看到网上css3写的3d动画效果,实在炫酷,以前理解为需要js去计算去写,没想到css直接可以实现.于是开始研究 ...

  9. tween.js是一款可生成平滑动画效果的js动画库。tween.js允许你以平滑的方式修改元素的属性值。它可以通过设置生成各种类似CSS3的动画效果。

    简要教程 tween.js是一款可生成平滑动画效果的js动画库.相关的动画库插件还有:snabbt.js 强大的jQuery动画库插件和Tweene-超级强大的jQuery动画代理插件. tween. ...

随机推荐

  1. Linux下查看tomcat版本

    进入到tomcat的bin目录下,再执行./version.sh tomcat版本:7.0

  2. python 之修饰器

    from functools import update_wrapper def debug(func): def wrapper(): print "[DEBUG]: enter {}() ...

  3. 多线程服务端与客户端通信(IO是阻塞的)_02

    下面是多线程的;每次服务端接受请求,会创建一个线程专门处理这个请求: 虽然是多线程的,但还是阻塞,相当于单线程处理模式 public class TimeServer { public static ...

  4. python_13 面向对象

    面向对象 类:把一类事物的相同特征和动作整合到一起就是类,类是一个抽象的概念 对象:就是基于类出而创建的一个具体的事物或实例(具体存在),其特征和动作整合到一起 面向对象设计:将一类具体事物的数据和动 ...

  5. python module -- sys

    sys模块主要是用于提供对python解释器相关的操作 http://www.cnblogs.com/pycode/p/sysos.html http://blog.csdn.net/pipisorr ...

  6. 算法之Python实现 - 000

    Python的火热已极,几乎人人在学Python,为了节约时间,也为了实现Python的代码量,计划从今天开始,将<算法与数据结构题目最优解>一书中的代码全部用Python实现.

  7. Mac 下安装nvm 后vscode 输入node -v 不起作用

    今天下午,我因为要安装不同的node版本,所有安装了nvm下载了两个不同版本的node,并且配置了环境变量. 在命令行窗口中使用起来没有任何问题,但是在vs code中敲的时候node -v 显示no ...

  8. 使用拦截器对前端传入的字符串进行trim操作

    @Before("apiItf()") public void before(JoinPoint joinPoint) throws Exception { Object[] ar ...

  9. 云笔记项目- 上传文件报错"java.lang.IllegalStateException: File has been moved - cannot be read again"

    在做文件上传时,当写入上传的文件到文件时,会报错“java.lang.IllegalStateException: File has been moved - cannot be read again ...

  10. PDO查询语句结果中文乱码

    PDO::MYSQL_ATTR_INIT_COMMAND (整数)连接到MySQL服务器时执行的命令.重新连接时会自动重新执行.请注意,此常量只能driver_options 在构建新的数据库句柄时在 ...