zoukankan      html  css  js  c++  java
  • css3 图标上下移动动画

    @-webkit-keyframes bird{
         0% {
             -moz-transform: translate(0,0);
    	     -webkit-transform: translate(0,0);
    	     -o-transform: translate(0,0);
    	     -ms-transform: translate(0, 0);
    	     transform: translate(0,0);
         }
    
         25% {
             -moz-transform: translate(0,-10px);
    	     -webkit-transform: translate(0,-10px);
    	     -o-transform: translate(0,-10px);
    	     -ms-transform: translate(0, -10px);
    	     transform: translate(0,-10px);
         }
         50% {
             -moz-transform: translate(0,-20px);
    	     -webkit-transform: translate(0,-20px);
    	     -o-transform: translate(0,-20px);
    	     -ms-transform: translate(0, -20px);
    	     transform: translate(0,-20px);
         }
    
          75% {
             -moz-transform: translate(0,-10px);
    	     -webkit-transform: translate(0,-10px);
    	     -o-transform: translate(0,-10px);
    	     -ms-transform: translate(0, -10px);
    	     transform: translate(0,-10px);
         }
    
          100% {
             -moz-transform: translate(0,0);
    	     -webkit-transform: translate(0,0);
    	     -o-transform: translate(0,0);
    	     -ms-transform: translate(0, 0);
    	     transform: translate(0,0);
         }
    }
    

      

    .qi:not(:target),.birds:not(:target),.hong:not(:target){
    	-webkit-animation-name: bird;
    	-webkit-animation-duration: 5s;
    	-webkit-animation-timing-function: linear;
    	-webkit-animation-iteration-count: infinite;
    	-moz-animation-name: bird;
    	-moz-animation-duration: 5s;
    	-moz-animation-timing-function: linear;
    	-moz-animation-iteration-count: infinite;
    	-o-animation-name: bird;
    	-o-animation-duration: 5s;
    	-o-animation-timing-function: linear;
    	-o-animation-iteration-count: infinite;
    	-ms-animation-name: bird;
    	-ms-animation-duration: 5s;
    	-ms-animation-timing-function: linear;
    	-ms-animation-iteration-count: infinite;
    	animation-name: bird;
    	animation-duration: 5s;
    	animation-timing-function: linear;
    	animation-iteration-count: infinite;
    }
    

      

  • 相关阅读:
    socketpair和pipe的区别
    C++异常与析构函数及构造函数
    System v shm的key
    不可靠信号SIGCHLD丢失的问题
    非阻塞IO函数
    Android 编译时出现r cannot be resolved to a variable
    找工作笔试面试那些事儿(5)---构造函数、析构函数和赋值函数
    unable to load default svn client 和 Eclipse SVN 插件与TortoiseSVN对应关系
    演示百度地图操作功能
    求第i个小的元素 时间复杂度O(n)
  • 原文地址:https://www.cnblogs.com/xupeiyu/p/4146841.html
Copyright © 2011-2022 走看看