虾米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 存储过程名 ...
随机推荐
- ♫【JS基础】壹零零壹
如何面试一个前端开发者? function spacify(str) { return str.split('').join(' ') } console.log(spacify('hello wor ...
- -_-#【RequireJS】Define a Module
define({ color: 'black', size: 'unisize' }) define(function() { // Do setup work here return { color ...
- 综合查询员工和datetime.now和datetime.today区别
一:综合查询图 二:EmployeeListWindow.cs代码 using System; using System.Collections.Generic; using System.Compo ...
- Minimum Size Subarray Sum —— LeetCode
Given an array of n positive integers and a positive integer s, find the minimal length of a subarra ...
- hibernate生成查询语句但查不到数据
hibernate能够生成查询语句 说明它已经进行了查询操作 返回结果数据记录为0 很可能出现的情况 是 :该查询未未访问到指定数据库表. 当使用的数据库为oracle数据库时,你会在bean配置 ...
- kafka单机安装配置
1.下载kafka wget https://www.apache.org/dyn/closer.cgi?path=/kafka/0.8.2.1/kafka_2.9.2-0.8.2.1.tgz 2.解 ...
- web.xml基本配置描述
先加载一段写好的web.xml: <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2. ...
- 关于kali安装vmware的坑，linux套路太深。
http://www.linuxidc.com/Linux/2015-08/122240.htm 但是还有些坑 安装gcc5.4.1 apt-get install gcc-5 gcc-5所在目录 / ...
- python字符串连接的三种方法及其效率、适用场景详解
python字符串连接的方法,一般有以下三种:方法1:直接通过加号(+)操作符连接website=& 39;python& 39;+& 39;tab& 39;+& ...
- Demo_CS(移动，切换枪支，发射子弹)
using UnityEngine; using System.Collections; public class Gun : MonoBehaviour { private Animator ani ...