animation3 背景小动画笔记
<!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 背景小动画笔记的更多相关文章
- 【Visual C++】游戏编程学习笔记之六：多背景循环动画
本系列文章由@二货梦想家张程 所写,转载请注明出处. 本文章链接:http://blog.csdn.net/terence1212/article/details/44264153 作者:ZeeCod ...
- 如何制作网页小动画？——gif or png
一.场景与动画 为了拉动网站氛围,或者吸引用户浏览焦点,需要使用一些小动画.这种动画不是(gif)单纯的重复,而是需要需要一些控制和交互,比如在动画完成后打开一个对话框.动画有几个基本要素(时间控制, ...
- 问题杂烩(scrollTop/背景透明度动画)
今天给同学找我帮忙写js,是公司里的活..我是不是应该跟他要钱哈哈,不过一顿饭肯定是免不了的了. 言归正传,今天写了三个小东西,因为兼容性的问题,用jq写的(很是别扭的说,但是没办法啊,一边看api一 ...
- CSS3-实现单选框radio的小动画
在微信上看到一个教程文,觉得制作的小动画还是很有意思的,自己也试验了一下.一开始动画怎么都不执行(我用的HB),因为内置浏览器对css3的不兼容.加上各种浏览器前缀后就好了.但是旋转那个效果,在HB里 ...
- 基于html5页面滚动背景图片动画效果
基于html5页面滚动背景图片动画效果是一款带索引按钮的页面滚动动画特效代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div id="fullpage&q ...
- TabbarItem超炫小动画
本文转载自 不灭的小灯灯 的博客 Tabbar点击时候超炫小动画 感谢这位大神的分享! 对UITabBarController上TabBar按钮动画详细介绍-->>保证你有意外收获,如有 ...
- 利用jQuery实现用户名片小动画
我爱撸码,撸码使我感到快乐!大家好,我是Counter.下面给大家介绍利用jQuery实现的小动画,非常的简便,如果有原生js操作的话,那么就不止这么多行了.至于CSS,个人觉得,这边CSS布局也蛮重 ...
- Canvas 图片绕边旋转的小动画
/** * 图片绕边旋转的小动画 */ function initDemo10() { var canvas = document.getElementById("demo10") ...
- 8 Explicit Animations 指明的动画 笔记
8 Explicit Animations 指明的动画 笔记 If you want something done right, do it yourself. 如果你想让事情做好,那就自动来 ...
随机推荐
- linux对文件赋权限的命令chmod的详细说明
指令名称 : chmod使用权限 : 所有使用者 使用方式 : chmod [-cfvR] [--help] [--version] mode file... 说明 : Linux/Unix 的档案调 ...
- Maven与Hudson集成
Hudson是一款优秀的持续集成产品,本文阐述Maven于Hudson的集成 Hudson的下载和安装 Hudson有两种安装模式,1:自运行(Hudson内建netty容器),2:放到如tomc ...
- python的强制转换（当出现 not supported between instances of 'str' and 'int' 的错误时）
当我们编程时,有时会出现如下错误:TypeError: '>' not supported between instances of 'str' and 'int' 如下图: 这是因为input ...
- css自动适应宽度
.itemContent { background-color:#F0F0F0; padding:3px 11px 11px 11px; text-align:justify; text-justif ...
- go语言接受者的选取
何时使用值类型 1.如果接受者是一个 map,func 或者 chan,使用值类型(因为它们本身就是引用类型).2.如果接受者是一个 slice,并且方法不执行 reslice 操作,也不重新分配内存 ...
- Hadoop网站日志数据清洗——正则表达式实现
周旭龙前辈的Hadoop学习笔记—网站日志分析项目案例简明.经典,业已成为高校大数据相关专业的实验项目.上周博主也完成了这个实验,不同于周前辈使用特殊符号切割字符串得到数据的做法,博主使用了正则表达式 ...
- kibana-1-安装
由于es5.2版本对head的插件支持不如2.4 安装挺麻烦, 于是选用kibana 关于5.2安装head插件可见这个博客 http://www.cnblogs.com/xing901022/p/6 ...
- antlr4 接触
1. 配置IDE(可选) 2. 加减法示例 编写expr.g4 grammar AddMinus; expr: Minus Number #minusNum | expr op=('+'|'-') e ...
- java面试①整体流程
http://www.toutiao.com/i6463396763549041166/ 1.1 简单的自我介绍 我是xxx工作了xx年,在xx公司,做过xx项目, 1.2你简单介绍一下xxx项目 为 ...
- 高云的jQuery源码分析笔记
(function( window, undefined ) { // 构造jQuery对象 var jQuery = function( selector, context ) { return n ...