<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style type="text/css">

        .ren {

            width: 48px;

            height: 70px;

            background: url(images/timg.jpg) no-repeat;

            animation: donghua 5s steps(10);

            overflow: hidden;

        }

        @keyframes donghua {

            0% {

                background-position: -8px 0;

            }

            100% {

                background-position: -460px 0;

            }

        }

    </style>

</head>

<body>

<div class="ren"></div>

</body>

</html>

animation3 背景小动画笔记的更多相关文章

  1. 【Visual C++】游戏编程学习笔记之六：多背景循环动画

    本系列文章由@二货梦想家张程 所写,转载请注明出处. 本文章链接:http://blog.csdn.net/terence1212/article/details/44264153 作者:ZeeCod ...

  2. 如何制作网页小动画？——gif or png

    一.场景与动画 为了拉动网站氛围,或者吸引用户浏览焦点,需要使用一些小动画.这种动画不是(gif)单纯的重复,而是需要需要一些控制和交互,比如在动画完成后打开一个对话框.动画有几个基本要素(时间控制, ...

  3. 问题杂烩(scrollTop/背景透明度动画)

    今天给同学找我帮忙写js,是公司里的活..我是不是应该跟他要钱哈哈,不过一顿饭肯定是免不了的了. 言归正传,今天写了三个小东西,因为兼容性的问题,用jq写的(很是别扭的说,但是没办法啊,一边看api一 ...

  4. CSS3-实现单选框radio的小动画

    在微信上看到一个教程文,觉得制作的小动画还是很有意思的,自己也试验了一下.一开始动画怎么都不执行(我用的HB),因为内置浏览器对css3的不兼容.加上各种浏览器前缀后就好了.但是旋转那个效果,在HB里 ...

  5. 基于html5页面滚动背景图片动画效果

    基于html5页面滚动背景图片动画效果是一款带索引按钮的页面滚动动画特效代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="fullpage&q ...

  6. TabbarItem超炫小动画

    本文转载自 不灭的小灯灯  的博客 Tabbar点击时候超炫小动画 感谢这位大神的分享! 对UITabBarController上TabBar按钮动画详细介绍-->>保证你有意外收获,如有 ...

  7. 利用jQuery实现用户名片小动画

    我爱撸码,撸码使我感到快乐!大家好,我是Counter.下面给大家介绍利用jQuery实现的小动画,非常的简便,如果有原生js操作的话,那么就不止这么多行了.至于CSS,个人觉得,这边CSS布局也蛮重 ...

  8. Canvas 图片绕边旋转的小动画

    /** * 图片绕边旋转的小动画 */ function initDemo10() { var canvas = document.getElementById("demo10") ...

  9. 8 Explicit Animations 指明的动画 笔记

    8 Explicit Animations 指明的动画 笔记     If you want something done right, do it yourself. 如果你想让事情做好,那就自动来 ...

随机推荐

  1. leetcode 73 矩阵置零 Python

    矩阵置零     给定一个 m x n 的矩阵,如果一个元素为 0,则将其所在行和列的所有元素都设为 0.请使用原地算法. 示例 1: 输入: [   [1,1,1],   [1,0,1],   [1 ...

  2. POJ 1014

    #include<iostream>#include<stdio.h>#define num 6using namespace std; bool DFS(int i,int ...

  3. node开发环境配置

    node开发环境配置 用处 NodeJS——后台 JavaScript-前台 后台其他语言 1.PHP 2.Java 3.Pythonnode优势 1.性能高 nodejs php 86 1s 1分半 ...

  4. Python基础部分的疑惑解析——pycharm（4）

    PyCharm部分设置: 1.安装后破解    2.创建的项目project实际上就是文件夹,可以在右键--show in explorer显示文件夹 3.右键-new--directory是建文件夹 ...

  5. Binder AIDL中自定义类型传递的源码分析

    binder机制实现的IPC和共享内存的方式不同,它采取的是值拷贝的方式,即进程间传递的实体遵循Parcelable协议, Bp端负责向Parcel里写东西,Bn端负责从Parcel里读取还原,顺序是 ...

  6. Java之集合(十)EnumMap

    转载请注明源出处:http://www.cnblogs.com/lighten/p/7371744.html 1.前言 本章介绍Map体系中的EnumMap,该类是专门针对枚举类设计的一个集合类.集合 ...

  7. Java模拟双色球彩票

    package practice1; import java.util.Random; import java.util.Scanner; public class Test3 { /** * * 模 ...

  8. 【Java并发编程】：多线程环境中安全使用集合API

    在集合API中,最初设计的Vector和Hashtable是多线程安全的.例如:对于Vector来说,用来添加和删除元素的方法是同步的.如果只有一个线程与Vector的实例交互,那么,要求获取和释放对 ...

  9. [转]RESTful API 设计指南

    转自:http://www.ruanyifeng.com/blog/2014/05/restful_api.html 网络应用程序,分为前端和后端两个部分.当前的发展趋势,就是前端设备层出不穷(手机. ...

  10. SQL Function 自定义函数

    目录 产生背景(已经有了存储过程,为什么还要使用自定义函数) 发展历史 构成 使用方法 适用范围 注意事项 疑问   内容 产生背景(已经有了存储过程,为什么还要使用自定义函数) 与存储过程的区别(存 ...