演示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. JavaScript_DOM编程艺术第二版[阅]

    前两年迫于项目的需要,只是拿来JQuery用到项目中,并没有实质上理解javascript(貌似其他人也是这么干的)~ 随着最近几年,得益于Nodejs, React, Vue等,javascript ...

  2. dedecms织梦如何调用指定的多个栏目导航

    {dede:channelartlist row='2' typeid='1,2这里输入多个指定的栏目ID' } <li><a href='{dede:field name='typ ...

  3. 【Mac系统】之Mysql数据库遇到修改数字密码的问题(SQL语法错误:ERROR 1064 (42000),密码策略等问题:ERROR 1819 (HY000))

    安装完Mysql也进行了第一次初始化密码以及修改密码规则(请参考文章),但是我想后续再改密码,出现了下面几个问题: #SQL语句错误问题 ERROR 1064 (42000): You have an ...

  4. Swift_4_闭包(Blocks)

    import Foundation println("Hello, World!") var arr = [1,2,4,6,74,2] func hasClosure(list:[ ...

  5. iOS js oc相互调用(JavaScriptCore)---js调用iOS --js里面通过对象调用方法

    下来我们看第二种情况 就是js 中是通过一个对象来调用方法的. 此处稍微复杂一点我们需要使用到 JSExport 凡事添加了JSExport协议的协议,所规定的方法,变量等 就会对js开放,我们可以通 ...

  6. 如何在iOS中使用libxml

    本文转载至 http://blog.csdn.net/cloudhsu/article/details/8087628 1. 选择xcode工程设定 2. 选择target 3. 选择Summary ...

  7. Ubuntu 12.04使用uginx+fastcgi-mono-server2部署asp.net 网站

    Ubuntu 12.04使用uginx+fastcgi-mono-server2部署asp.net 网站 1.安装nginx和mono-fastcgi-server2 sodu apt-get  in ...

  8. java jdk和android sdk的安装以及环境变量的配置

    安卓环境变量设置 (烦)http://wenku.baidu.com/link?url=QRwpFhP8d0yJorhcvuZPrz3lNFQW-uwYg6TlZtv6uen6_SVsvRrzf0UJ ...

  9. Jeecms 防xss处理原理

    Web.xml配置过滤器,并指的要过滤和替换的字符: 过滤器的filter方法,对传入的HttpServletRequest对象进行了修改 具体过滤在XssHttpServletRequestWrap ...

  10. linux c编程:线程互斥一

    当多个线程共享相同的内存的时候,需要确保每个线程都看到一致的数据视图.如果每个线程使用的变量都是其他线程不会读取和修改的.那么就不存在一致性问题.同样,如果变量是只读的,多个线程也不会有一致性的问题. ...