演示1 直接旋转一个角度

$('#img1').rotate(45);

演示2 鼠标移动效果

$('#img2').rotate({
bind : {
mouseover : function(){
$(this).rotate({animateTo: 180});
}, mouseout : function(){
$(this).rotate({animateTo: 0});
}
}
}); 演示3 不停旋转 var angle = 0;
setInterval(function(){
angle +=3;
$('#img3').rotate(angle);
}, 50); var rotation = function (){
$('#img4').rotate({
angle: 0,
animateTo: 360,
callback: rotation
});
}
rotation(); var rotation2 = function(){
$('#img5').rotate({
angle: 0,
animateTo: 360,
callback: rotation2,
easing: function(x,t,b,c,d){
return c*(t/d)+b;
}
});
}
rotation2(); 演示4 点击旋转 $('#img6').rotate({
bind: {
click: function(){
$(this).rotate({
angle: 0,
animateTo: 180,
easing: $.easing.easeInOutExpo
});
}
}
}); var value2 = 0;
$('#img7').rotate({
bind: {
click: function(){
value2 +=90;
$(this).rotate({
animateTo: value2
});
}
}
});

  参考地址:http://www.jq22.com/jquery-info308

jQuery旋转插件jquery.rotate.js 让图片旋转的更多相关文章

  1. rotate.js实现图片旋转 (chrome,IE,firefox都可以实现)

    找了好多资料,要么是IE可以用,但是谷歌不行,,还有就是两个都可以用的,图片大小显示不全.终于找到一个好一点的js,先贴一下代码. 1.rotate.js jQuery.fn.rotate = fun ...

  2. jQuery滚动条插件 – jquery.slimscroll.js

    jquery.slimscroll.js插件是一个支持把内容放在一个盒子里面,固定一个高度,超出的则使用滚动.jquery.slimscroll.js不仅可以定义高度.宽度,还可以定义位置.滚动条大小 ...

  3. jQuery分页插件(jquery.page.js)的使用

    效果描述: 不用分页即可显示的jQuery插件 jQuery分页插件——jQuery.page.js用法很简单,效果很棒   1.前端   首先html的head中引入相关css与js <lin ...

  4. js实现图片旋转、模板文件查看图片大图之记录篇[二]

    一个小小的前端需求送给大家,使用js实现图片旋转,并且点击图片能够实现规定格式的大图. 主要使用的是jQuery的delegate()方法实现图片旋转,该方法主要的功能就是给某个组件绑定一个或一组事件 ...

  5. Jquery 分页插件 Jquery Pagination

    Jquery 分页插件 Jquery Pagination 分页插件来说,我觉得适用就行,尽量简单然后能够根据不同的应用场景能够换肤.展现形式等. 对于初学者想写分页插件的同学,也可以看下源码,代码也 ...

  6. jQuery遮罩插件 jquery.blockUI.js

    Overview jQuery BlockUI 插件可以在不同锁定浏览器的同时,模拟同步模式下发起Ajax请求的行为.该插件激活时,会组织用户在页面进行的操作,直到插件被关闭.BlockUI通过向DO ...

  7. 【js】js 让图片旋转

     转http://www.cnblogs.com/ustcyc/p/3760116.html 核心: canvas.style.filter = "progid:DXImageTransfo ...

  8. JQuery多媒体插件jQuery Media Plugin使用详解

    malsup jquery media plugin 该插件可以播放多种类型的多媒体文件包括:Flash, Quicktime, Windows Media Player, Real Player, ...

  9. js实现图片旋转

    1.以下代码适用ie9版本 js代码如下: function rotate(o,p){ var img = document.getElementById(o); if(!img || !p) ret ...

随机推荐

  1. ArrayList add remove 代码分析

    Add 首次add 元素需要对数组进行扩容(初始化Capacity 10, 第二次扩容10>>1 为5, 第三次扩容15>>1 为7), 每次扩容之前长度的1.5倍,当add ...

  2. 机器学习6—SVM学习笔记

    机器学习牛人博客 机器学习实战之SVM 三种SVM的对偶问题 拉格朗日乘子法和KKT条件 支持向量机通俗导论(理解SVM的三层境界) 解密SVM系列(一):关于拉格朗日乘子法和KKT条件 解密SVM系 ...

  3. 快速用CMD打开当前目录

    按住shift,鼠标右键,选择在此处打开命令行窗口.

  4. run ceph in docker

    申明:基本安装是依照http://dockone.io/article/436来进行的,但原文中ceph集群的搭建不够完整.我这里会做一些补充及说明. 1.   下载mon和osd镜像 [root@u ...

  5. How can I detect multiple logins into a Django web application from different locations?

    1) Install django-tracking (thankyou for that tip Van Gale Google Maps + GeoIP is amazing!) 2) Add t ...

  6. Keil 中 Program Size: Code RO-data RW-data ZI-data 所代表的意思

    在Keil中编译工程成功后,在下面的Bulid Ouput窗口中会输出下面这样一段信息: Program Size: Code=6320 RO-data=4864 RW-data=44 ZI-data ...

  7. hiho一下 第二周&第四周:从Trie树到Trie图

    hihocoder #1014 题目地址:http://hihocoder.com/problemset/problem/1014 hihocoder #1036 题目地址: http://hihoc ...

  8. ios 深入讲解iOS键盘一:控制键盘隐藏显示

    在iOS的开发中,我们一般使用UITextField.UITextView处理文字输入等操作,大部分情况下我们只需要一两行代码去手动管理键盘的显示隐藏:让UITextField或UITextView成 ...

  9. Java final关键字特点

    一.特点 1.由于继承,方法可以重写,所以父类的功能就会被子类覆盖2.有时候我们不想子类覆盖父类的功能,这时候我们可以使用final关键字3.final可以修饰:类.变量,方法.4.final修饰类, ...

  10. C++中面向对象的理解

     1.对于OO(面向对象)的含义,并非每一个人的看法都是同样的. 即使在如今.假设问十个人,可能会得到15种不同的答案.差点儿全部的人都会允许继承和多态是OO中的概念.大多数人还会再加上封装. 另 ...