Jquery控件jrumble
<!DOCTYPE HTML>
<html>
<head>
<title>demo.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/prettify.css" />
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/jquery.jrumble.1.3.min.js"></script>
<script src="js/prettify.js"></script>
<script type="text/javascript">
$(function(){
/*========================================================*/
/* Ranges
/*========================================================*/
$('#demo1').jrumble({
x: 2,
y: 2,
rotation: 1
});
$('#demo2').jrumble({
x: 10,
y: 10,
rotation: 4
});
$('#demo3').jrumble({
x: 4,
y: 0,
rotation: 0
});
$('#demo4').jrumble({
x: 0,
y: 0,
rotation: 5
});
$('#demo1, #demo2, #demo3, #demo4').hover(function(){
$(this).trigger('startRumble');
}, function(){
$(this).trigger('stopRumble');
});
});
</script>
</head>
<body onLoad="prettyPrint()">
<div id="content">
<div class="demo-box">
<h4>x: 2<br/>y: 2<br/>rotation: 1</h4>
<div id="demo1">1</div>
</div>
<div class="demo-box">
<h4>x: 10<br/>y: 10<br/>rotation: 4</h4>
<div id="demo2">2</div>
</div>
<div class="demo-box">
<h4>x: 4<br/>y: 0<br/>rotation: 0</h4>
<div id="demo3">3</div>
</div>
<div class="demo-box last">
<h4>x: 0<br/>y: 0<br/>rotation: 5</h4>
<div id="demo4">4</div>
</div>
</div>
</body>
</html>
Jquery控件jrumble的更多相关文章
- 【番外篇】ASP.NET MVC快速入门之免费jQuery控件库（MVC5+EF6）
目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...
- jQuery控件有所感悟
两种写法对比: 第一种: ;(function($){ $.fn.myplugin = function(op,params){ if (typeof op == 'string'){ return ...
- jquery控件的学习
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Tag It 一款 Jquery控件，当你在文本框中输入逗号时，自动帮你分隔开相关内容
Demo地址:http://webspirited.com/tagit/ 使用方法: 除了JQuery脚本外,下面的脚本也是必须的,这些脚本你都可以去GitHub下载:https://github.c ...
- jQuery控件之分页控件-- kkpager v1.3使用简介
js分页展示控件,传入简单参数就能使用的分页效果控件 在线测试链接: http://pgkk.github.io/kkpager/example/pager_test.html http://pgkk ...
- [JS] jquery控件基本要点备份
(1)CDN Google CDN:<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min. ...
- Jquery 控件
1. Jeditable 2. Select2 3. superfish 4. Jquery file upload https://blueimp.github.io/jQuery-File-Upl ...
- fineuploader 上传jquery 控件
fineuploader 昨天用的一个jquery插件. 可参考这篇文章以前写的 file-uploader 跟 这个跟里面介绍的2个jquery 插件相比.觉得更强大写..版本号都3.9 了….. ...
- jquery控件-实现自定义样式的弹出窗口和确认框（转）
(function () { $.MsgBox = { Alert: function (title, msg) { GenerateHtml("alert", title, ms ...
随机推荐
- u-boot启动代码start.S详解
(1)定义入口.由于一个可执行的Image必须有一个入口点,并且只能有一个全局入口,通常这个入口放在ROM(Flash)的0x0地址,因此,必须通知编译器以使其知道这个入口,该工作可通过修改连接器脚本 ...
- mysql创建数据库并指定uft8编码
CREATE DATABASE IF NOT EXISTS ymk default character set utf8 COLLATE utf8_general_ci;
- SpringBoot 消费NSQ消息
使用监听器,来实现实时消费nsq的消息 一.目前spring boot中支持的事件类型如下 ApplicationFailedEvent:该事件为spring boot启动失败时的操作 Applica ...
- nignx 502错误不能使用/的路径方式 即pathinfo
在server中加入 include enable-php-pathinfo.conf; 引入nginx.conf下的这个文件即可. 如果是tp框架,主要隐藏index.php的入口文件,再加入下面这 ...
- webstorm卡顿问题处理
webstorm卡顿问题处理 学习了:http://blog.csdn.net/qq673318522/article/details/50583831 找到WebStorm.exe.vmoption ...
- MySQL高可用系列之MHA（二）
一.參数说明 MHA提供了一系列配置參数.深入理解每一个參数的详细含义,对优化配置.合理使用MHA非常重要.非常多高可用性也都是通过合理配置一些參数而实现的. MHA包含例如以下配置參数,分别说明例如 ...
- CURL库的宏定义列表
列表CURL库一共同拥有17个函数 curl_close:关闭CURL会话 curl_copy_handle:复制一个CURL会话句柄,同一时候3复制其全部參数 curl_errno:返回最后一个错误 ...
- XML 解析---dom解析和sax解析
眼下XML解析的方法主要用两种: 1.dom解析:(Document Object Model.即文档对象模型)是W3C组织推荐的解析XML的一种方式. 使用dom解析XML文档,该解析器会先把XML ...
- cocos2d-x 3.0的坑有哪些
问题一:setup.py 之后, ANT文件夹为什么创建不成功? ANT文件夹要指定到bin以下,NDK和SDK则指定要根文件夹就可以 问题二:cocos run -p android 之后,执行应用 ...
- ThinkPHP5.0框架开发--第1章 Tp5.0安装
ThinkPHP5.0框架开发--第1章 Tp5.0安装 第1章 Tp5.0 安装 ======================================================== 今 ...