虾米loop 摇头代码
.head{
position: absolute;
-webkit-animation: shake 1s infinite;
-webkit-transform-origin: center bottom;
}
@-webkit-keyframes shake{
0% {
-webkit-transform:rotate(-5deg);
}
50% {
-webkit-transform:rotate(5deg);
}
100% {
-webkit-transform:rotate(-5deg);
}
}
CSS3 @keyframes 用法:
http://www.w3school.com.cn/cssref/pr_keyframes.asp
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<style>
.head{
position: absolute;
-webkit-animation: shake 1s infinite;
-webkit-transform-origin: center bottom;
}
@-webkit-keyframes shake{
0% {
-webkit-transform:rotate(-5deg);
}
50% {
-webkit-transform:rotate(5deg);
}
100% {
-webkit-transform:rotate(-5deg);
}
}}
}
</style>
</head>
<body>
<div class="head"><img src="http://img.xiami.net/res/loop/img/avatar/head_back_girl.png" class="head_img"></div>
</body>
</html>
在线DEMO: http://jsbin.com/vaqicejapa
虾米loop 摇头代码的更多相关文章
- xilinx DMA IP核(一) —— loop测试 代码注释
本篇笔记中的代码来自:米联科技的教程“第三季第一篇的DMA_LOOP环路测试” 硬件的连接如下图所示: 图:DMA Loop Block Design 橘色的线就是DMA加FIFO组成的一个LOOP循 ...
- 编译器工程师眼中的好代码：Loop Interchange
摘要:本文将以Loop Interchange的场景为例,讲述在编写代码时可以拿到更优性能的书写方式. 本文分享自华为云社区<编译器工程师眼中的好代码(1):Loop Interchange&g ...
- Run Loop详解
Run loops是线程的基础架构部分.一个run loop就是一个事件处理循环,用来不停的调配工作以及处理输入事件.使用run loop的目的是使你的线程在有工作的时候工作,没有的时候休眠. Run ...
- (jsp/html)网页上嵌入播放器(常用播放器代码整理) http://www.jb51.net/article/37267.htm
网页上嵌入播放器,只要在HTML上添加以上代码就OK了,下面整理了一些常用的播放器代码,总有一款适合你,感兴趣的朋友可以参考下哈,希望对你有所帮助 这个其实很简单,只要在HTML上添加以上代码就O ...
- Game Loop的几种实现方式
http://www.bennychen.cn/2011/06/game-loop-model/ —————————————————————————————— 写这篇博客的目的是为了对game loo ...
- linux shell scripts：Syntax error: Bad for loop variable
执行脚本报错 #!/bin/bash s=0 for (( i=1; i<=100; i++ )) do s=$(( $s + $i )) done echo $s sh add.sh 报错: ...
- 事件循环 event loop 究竟是什么
事件循环 event loop 究竟是什么 一些概念 浏览器运行时是多进程,从任务管理器或者活动监视器上可以验证. 打开新标签页和增加一个插件都会增加一个进程,如下图:  浏览器渲染进程是多线程,包 ...
- oracle 存储过程
来自:http://www.jb51.net/article/31805.htm Oracle存储过程基本语法 存储过程 1 CREATE OR REPLACE PROCEDURE 存储过程名 2 I ...
- Oracle存储过程语法
原文链接:http://www.jb51.net/article/31805.htm Oracle存储过程基本语法 存储过程 1 CREATE OR REPLACE PROCEDURE 存储过程名 ...
随机推荐
- -_-#【jQuery插件】Colorpicker 颜色选择器
Spectrum - The No Hassle jQuery Colorpicker (jQuery 插件) Color Picker jQuery plugins (jQuery 插件) colo ...
- Ganglia监控搭建
一．Ganglia介绍: Ganglia是一个监控服务器.集群的开源软件,能够用曲线图表现最近一个小时,最近一天,最近一周,最近一月,最近一年的服务器或者集群的cpu负载,内存,网络,硬盘等指标.Ga ...
- 数学 ZJOI 2012 数列
#include <iostream> #include <cstring> #include <cstdio> using namespace std; ; st ...
- LeetCode (85): Maximal Rectangle [含84题分析]
链接: https://leetcode.com/problems/maximal-rectangle/ [描述] Given a 2D binary matrix filled with '0's ...
- 《ACM国际大学生程序设计竞赛题解I》——6.10
Pku 1143: Description Christine and Matt are playing an exciting game they just invented: the Number ...
- qconf 介绍
转载自:http://www.tuicool.com/articles/BJfiMbr 360 如何用 QConf 搞定 2W+ 服务器的配置管理 时间 2015-06-29 09:27:47 佚名 ...
- Directx 3D编程实例：绘制3DMesh
最近朋友建议我写一些关于微软云技术的博客留给学校下一届的学生们看,怕下一届的MSTC断档.于是我也觉的有这个必要.写了几篇博客之后,我觉得也有必要把这一年的学习内容放在博客做个纪念,就这样写了本篇博客 ...
- MYSql查詢一段時間記錄
24小时内记录(即86400秒) $sql="SELECT video_id,count(id)as n FROM `rec_down` WHERE UNIX_TIMESTAMP(NOW() ...
- GCOV 使用用例
1.GCOV查看arm-linux代码覆盖率 一. 关于gcov工具 gcov伴随gcc 发布.gcc编译加入-fprofile-arcs -ftest-coverage 参数 ...
- 前端工具之WebPack解密之背景
请注意,这是一篇站在完全新手的角度上来写的文章.可能你是一个后端人员想了解前端工具的使用和概念;也可能你是一个前端小菜(还在DIV+CSS的世界里挣扎着).本文比较适合那些以前完全没有接触过WebPa ...