地址:http://www.cnblogs.com/sun927/p/5842852.html

几个别人总结的css3炫酷效果,有需要直接拿来用即可,包括以下几个效果:

1。悬浮时放大

2.悬浮时转一圈

3.自动不停转圈

4.颜色自动越来越浅

.four{animation:mymove linear 5s infinite;-webkit-animation:mymove linear 5s infinite; /*Safari and Chrome*/}
 
@keyframes mymove
{
    from {<br>          opacity:1;
        filter:Alpha(opacity=100);
        transform:scale(1);
        -webkit-transform:scale(1);
        -moz-transform:scale(1);
        -o-transform:scale(1);
        -ms-transform:scale(1);}
    to {<br>          opacity:0.1;
        filter:Alpha(opacity=10);
        transform:scale(1.1);
        -webkit-transform:scale(1.1);
        -moz-transform:scale(1.1);
        -o-transform:scale(1.1);
        -ms-transform:scale(1.1);}
}
@-webkit-keyframes mymove /*Safari and Chrome*/
{
    from {
          opacity:1;
      filter:Alpha(opacity=100);
      transform:scale(1);
      -webkit-transform:scale(1);
      -moz-transform:scale(1);
      -o-transform:scale(1);
      -ms-transform:scale(1);
     }
    to {
          opacity:0.1;
      filter:Alpha(opacity=10);
      transform:scale(1.1);
      -webkit-transform:scale(1.1);
      -moz-transform:scale(1.1);
      -o-transform:scale(1.1);
      -ms-transform:scale(1.1);
    }
}

h5 特效的更多相关文章

  1. 【干货】微信场景之H5页面制作免费工具大集合

    营销代有手段出,各领风骚数百天.要说现在哪些营销方式最能传播,屡屡刷爆朋友圈的H5页面肯定就是首当其冲的,提到H5页面,就立马想到"围住神经猫",上线微信朋友圈3天的时间便创造了用 ...

  2. 易企秀 we+ Maka 兔展 四大H5页面制作工具

    H5这个由HTML5简化而来的词汇,正通过微信广泛传播.H5是集文字.图片.音乐.视频.链接等多种形式的展示页面,丰富的控件.灵活的动画特效.强大的交互应用和数据分析,高速低价的实现信息传播,非常适合 ...

  3. css-单位%号-background-size-background-position-遁地龙卷风

    (-1)写在前面 我用的是chrome49,这篇是为后续做准备.重要性的调整以及毕业资料的整体导致最近没看JQuery和H5特效,以后只能晚上看了. (0)准备 div长宽都为300px,我们一张大小 ...

  4. Windjs应用

    一个异步的js类库,应用价值不大,所以代码也没在维护了.在做h5特效或者游戏动画方面有点用处. $await是Windjs的核心api.具体可以check 浅谈Jscex的$await语义及异步任务模 ...

  5. 我的web前端整理和学习

    知识点收藏:(边看.边记录.边写) 开直播学习:虎牙 待办事理>> 练习自我表达(把文章做成视频).技术学习总结(博客与公众号).跳出舒适圈. 前端知识体系:https://www.cnb ...

  6. Sqlite表结构读取工具,word批量转html,在线云剪贴板,文件批量提取工具;

    工欲善其事必先利其器,本周为您推荐工具排行 Sqlite表结构读取工具,word批量转html,在线云剪贴板,文件批量提取工具:     本周我们又要发干货了,准备好接受了吗? 为什么是干货,就是因为 ...

  7. 几个H5炫酷特效

    那H5里有哪些高级动效了?小编仔细体验了国内不少几个优秀H5页面作品,整理出下面几个H5页面特效.我们的H5作品如果能用上其中一两个,相信能增色不少! 1.粒子特效 —>>一键爆炸 模拟现 ...

  8. H5下拉刷新特效demo,动画流畅

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  9. css3波纹特效、H5实现动态波浪

    css3实现动态波纹特效,由于css3里面有过渡和动画效果,现在利用css3实现动态波浪效果就很简单了,直接使用transform来实现就ok, 使得translateX 产生偏移就可以不断实现循环动 ...

随机推荐

  1. linux下jdk环境的搭建

    1.jdk的下载 2.linux centos7.2  64位下的安装和环境变量配置 1.jdk的下载 下载地址:https://www.oracle.com/technetwork/java/jav ...

  2. Paid consultation (currently free 20190901)

    Master of Electrical Engineering, Chongqing University Range:01 College entrance examination, major, ...

  3. 阿里云Centos 7.6安装Redis以及开启远程连接

    下载地址:http://redis.io/download,下载最新稳定版本. 本教程使用的最新文档版本为 5.0.5,下载并安装: $ wget http://download.redis.io/r ...

  4. 最新 汽车之家java校招面经 (含整理过的面试题大全)

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.汽车之家等10家互联网公司的校招Offer,因为某些自身原因最终选择了汽车之家.6.7月主要是做系统复习.项目复盘.Leet ...

  5. 解决Vue跨域问题 : 正向代理与反向代理

    你需要做一个反向代理的东西   ===> 打开你的vue项目的config文件夹下的index.js 找到以下代码 dev: { proxyTable: { '/api': { target: ...

  6. SpringBoot异步编程

    异步调用:当我们执行一个方法时,假如这个方法中有多个耗时的任务需要同时去做,而且又不着急等待这个结果时可以让客户端立即返回然后,后台慢慢去计算任务.当然你也可以选择等这些任务都执行完了,再返回给客户端 ...

  7. CentOS7 安装mysql(YUM源方式)

    1.下载mysql源安装包 $ wget http://dev.mysql.com/get/mysql57-community-release-el7-8.noarch.rpm   2.安装mysql ...

  8. J.U.C之AQS介绍

    从JDK1.5开始,引入了并发包java.util.concurrent(J.U.C),并发容器里的同步容器AQS(AbstractQueuedSynchronizer)是J.U.C的核心,AQS底层 ...

  9. (十一)springMvc 异常处理

    文章目录 思路 自定义异常处理类 全局异常处理器 配置全局异常处理器 思路 在 springMvc 中,异常一层一层的往上抛,最后抛给 前端控制器,前端控制器内部会去找 全局异常处理器(一个系统只会有 ...

  10. HDU 1325 有根树的判断

    Is It A Tree? Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total ...