地址: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. json转换成dart类 JSON to Dart

    json_to_dart的使用 如果我们得到一个特别复杂的JSON,有时候会无从下手开始写Model,这时候就可以使用一些辅助工具.我认为json_to_dart是比较好用的一个.它可以直接把json ...

  2. Run Hyper-V and VirtualBox on the same machine (轉載)

    Run Hyper-V and VirtualBox on the same machine Posted on September 5, 2012 by derek gusoff Recently ...

  3. 部署 --- Nginx

    Nginx介绍 简介: Nginx是由伊戈尔.塞索耶夫开发的,在04年10月开源的一款高性能HTTP和反向代理服务器. 因为它的稳定性好,功能丰富,有示例配置文件和较低的系统资源消耗而闻名 同时也是一 ...

  4. 【文章存档】Local Git 如何部署分支

    又来存档文章了,链接 https://docs.azure.cn/zh-cn/articles/azure-operations-guide/app-service-web/aog-app-servi ...

  5. 44.python排序算法(冒泡+选择)

    一,冒泡排序: 是一种简单的排序算法.它重复地遍历要排序的数列,一次比较两个,如果他们的排序错误就把他们交换过来. 冒泡排序是稳定的(所谓稳定性就是两个相同的元素不会交换位置) 冒泡排序算法的运作如下 ...

  6. CentOS7编译安装libc++和libc++abi

    本文介绍了如何在CentOS 7中构建C++11构建环境 Clang的定制C++库是libc++(libcxx).然后,libcxx还需要一个ABI库,libc++abi(libcxxabi).不幸的 ...

  7. js统计页面中各个标签出现的次数,倒序排列

    // html <html> <div>hello</div> <div>world</div> <a href="&quo ...

  8. jquery和Ajax(异步js和XML)的应用

    Ajax不是值一种单一的技术,而是有机的利用了一系列的交互式网页应用相关的技术所形成的的结合体.它的出现,解开了无刷新更新网页的新时代,并代替传统的Web方式和通过隐藏的框架来进行异步提交的趋势,是w ...

  9. mybatis三种批量插入方式对比

    <insert id="addInquiryQA" parameterType="java.util.List"> insert into inqu ...

  10. Design Compressed String Iterator

    Design and implement a data structure for a compressed string iterator. It should support the follow ...