.page3_ship{

background:url(../image/boat_02.png) 0 center no-repeat;
background-size: 486px 385px;
position:absolute;bottom:0;left:50%;margin-left:-121.5px;width:243px;height:385px;}

当两个类名同时存在时生效
.page3_ship.animate{
-webkit-animation: 1s animate_page3ship steps(2) infinite;
}

规定动画各个阶段的状态和动画名字
@-webkit-keyframes animate_page3ship{
0%{background-position: 0 0;}
100%{background-position: -486px 0;}
}

添加aimate动画的更多相关文章

  1. Android动画效果之自定义ViewGroup添加布局动画

    前言: 前面几篇文章介绍了补间动画.逐帧动画.属性动画,大部分都是针对View来实现的动画,那么该如何为了一个ViewGroup添加动画呢?今天结合自定义ViewGroup来学习一下布局动画.本文将通 ...

  2. JavaScript网站设计实践（三）设计有特色的主页，给主页链接添加JavaScript动画脚本

    一.主页一般都会比较有特色,现在在网站设计(二)实现的基础上,来给主页添加一点动画效果. 1.这里实现的动画效果是:当鼠标悬停在其中某个超链接时,会显示出属于该页面的背景缩略图,让用户知道这个链接的页 ...

  3. Android至ViewPager添加切换动画——使用属性动画

    转载请注明出处:http://blog.csdn.net/allen315410/article/details/44200623 ViewPager作为Android最经常使用的的组件之中的一个.相 ...

  4. Android使用shape制作圆形控件及添加弹跳动画

    --------本来为作者原创,未经同意禁止转载 前言:我们在很多时候都需要在res/drawable文件夹下创建相应的xml文件来为控件添加一些样式效果,比如按钮按下时的按钮样式变化.或者指定按钮的 ...

  5. SpriteBuilder中如何给精灵添加帧动画

    首先你必须准备若干幅图片,当然最好做成Smart Sprite Sheet. 打开一个CCB文件,并鼠标选择根节点的CCSprite对象. 保持前者选中且Timeline的当前时间点把手在最左边,然后 ...

  6. iOS-tableViewCell创建时添加一些动画

    有时候因为项目的需要,给tableView添加一些动画: cell.layer.transform = CATransform3DMakeScale(); [UIView animateWithDur ...

  7. Android笔记之为自定义对话框添加移动动画效果

    给底部的对话框添加移动动画效果 可通过Window.setWindowAnimations(int resId)设置 SharingDialog.java package com.bu_ish.sha ...

  8. 微课制作软件Camtasia，来为视频添加预设动画效果

    之前已介绍过使用微课制作软件Camtasia为视频添加"缩放和平移"动画的教程以及"效果按钮"的使用. 此篇内容,我们就来介绍使用录像编辑软件--Camtasi ...

  9. [f]添加css3动画的方法

    添加css3的一些动画的属性 使用方法: css3(oDiv[0], 'scale', 300)('rotate', 300);css3(oDiv[0], 'animation', '"dd ...

随机推荐

  1. APK骨架分析

    APK反编译的一般步骤是: 使用apktool将apk文件解压(后辍apk改为rar用winrar也可解压但这样不能解密res/value目录下的各文件),厉害的可以直接静态分析smali文件(ida ...

  2. py request.post header

    headers = {'User-Agent': 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.11 (KHTML, like Gecko) Chrome ...

  3. laravel中当使用Elquent ORM中的模型作为参数进行传递时的方法：

    Controller中的函数: /* $modelArg:是调用模型的路径,以字符串的形式传递过来. $id:要查询当前模型的id号. $args:具体查询的字段 */ public function ...

  4. 普通程序员，三年成为年薪70w架构师，只因做到了这些

    每个程序员.或者说每个工作者都应该有自己的职业规划,如果你不是富二代,不是官二代,也没有职业规划,希望你可以思考一下自己的将来.今天给大家分享的是一篇来自阿里Java架构师对普通程序员的职业建议,希望 ...

  5. 随机生成id

    function getRandom(){ return Math.random().toString(36).substring(7);}

  6. flask不定参数的传递。多参数，多次传递

    有的时候有一个分类查询,再来一个排序,这就有两个参数要传递多次. 还是不定长度,不定内容的传递. 这个是用request.args来实现: def home(): requests=request.a ...

  7. sqlalchemy（一）常用连接参数及包

    简介: 本文默认你已经有了一定的数据库基础.我们不喜欢写原生SQL语句,那个写着费劲,日常开发时候,我们怎么CRUD数据库呢?一般使用ORM,对象关系映射(英语:Object Relational M ...

  8. js 动态绑定鼠标事件

    <script> function getElementsByClassName(n) { var classElements = [],allElements = document.ge ...

  9. Web API之路由浅谈

    Web API的路由,是指明接口地址的方向,是照亮获取数据路上的灯塔,其重要性不言而喻. 本篇文章以vs2015为例,一步步说明路由的创建及使用,其中包括默认路由.自定义路由和特性路由. 一.默认路由 ...

  10. 一. Python基础(1)--语法

    一. Python基础(1)--语法 1. 应用程序 1.1 什么是计算机(Computer)? 组成 ①运算器 arithmetic unit; ※ Arithmetic unit and cont ...