jQuery旋转插件jquery.rotate.js 让图片旋转
演示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 让图片旋转的更多相关文章
- rotate.js实现图片旋转 (chrome,IE,firefox都可以实现)
找了好多资料,要么是IE可以用,但是谷歌不行,,还有就是两个都可以用的,图片大小显示不全.终于找到一个好一点的js,先贴一下代码. 1.rotate.js jQuery.fn.rotate = fun ...
- jQuery滚动条插件 – jquery.slimscroll.js
jquery.slimscroll.js插件是一个支持把内容放在一个盒子里面,固定一个高度,超出的则使用滚动.jquery.slimscroll.js不仅可以定义高度.宽度,还可以定义位置.滚动条大小 ...
- jQuery分页插件(jquery.page.js)的使用
效果描述: 不用分页即可显示的jQuery插件 jQuery分页插件——jQuery.page.js用法很简单,效果很棒 1.前端 首先html的head中引入相关css与js <lin ...
- js实现图片旋转、模板文件查看图片大图之记录篇[二]
一个小小的前端需求送给大家,使用js实现图片旋转,并且点击图片能够实现规定格式的大图. 主要使用的是jQuery的delegate()方法实现图片旋转,该方法主要的功能就是给某个组件绑定一个或一组事件 ...
- Jquery 分页插件 Jquery Pagination
Jquery 分页插件 Jquery Pagination 分页插件来说,我觉得适用就行,尽量简单然后能够根据不同的应用场景能够换肤.展现形式等. 对于初学者想写分页插件的同学,也可以看下源码,代码也 ...
- jQuery遮罩插件 jquery.blockUI.js
Overview jQuery BlockUI 插件可以在不同锁定浏览器的同时,模拟同步模式下发起Ajax请求的行为.该插件激活时,会组织用户在页面进行的操作,直到插件被关闭.BlockUI通过向DO ...
- 【js】js 让图片旋转
转http://www.cnblogs.com/ustcyc/p/3760116.html 核心: canvas.style.filter = "progid:DXImageTransfo ...
- JQuery多媒体插件jQuery Media Plugin使用详解
malsup jquery media plugin 该插件可以播放多种类型的多媒体文件包括:Flash, Quicktime, Windows Media Player, Real Player, ...
- js实现图片旋转
1.以下代码适用ie9版本 js代码如下: function rotate(o,p){ var img = document.getElementById(o); if(!img || !p) ret ...
随机推荐
- openWRT自学---自己编译的第一个 backfire10.03 版本的过程记录 --- 实际是由于下载了错误的backfire源码包导致的
基于 backfire10.03(从http://downloads.openwrt.org/backfire/10.03/ 中下砸的源码包backfire_10.03_source.tar.bz2: ...
- maven 依赖文件 pom.xml 编译 mvn compile 运行 不用mvn exec:java -Dexec.mainClass="hello.HelloWorld" 打成jar包 mvn package mvn install http://blog.csdn.net/yaya1943/article/details/48464371
使用maven编译Java项目 http://blog.csdn.net/yaya1943/article/details/48464371 使用"mvn clean"命令清除编 ...
- 恢复不小心误覆盖的代码文件 (sublime编辑器)
最新写了一个python脚本,另外在终端上运行一个shell脚本循环记录一些性能.耗时参数.取出记录的数据,使用python pyplot强大的绘图功能来可视化,易用程度仅次于matlab. 本次文件 ...
- 【转】Jenkins+Ant+Jmeter接口自动化集成测试实例
出处:https://my.oschina.net/MrToStudy/blog/742251 一.Jenkins安装配置 1.安装配置JDK1.6+环境变量: 2.下载jenkins.war,放入C ...
- chattr
chattr 功能:设置文件隐藏属性常用参数:+ 增加某个特殊权限,其他原本存在的参数不动- 删除某个特殊权限,其他原本存在的参数不动= 设置一定,且仅有后面接的参数 i 文件 ...
- Cassandra数据库Java訪问
针对的时Cassandra 2.0 数据库 Java本地client訪问Cassandra,首先建立Javaproject,使用Maven进行管理. 引入依赖: <dependency> ...
- Keepalived 集群在Linux下的搭建
[概述]:Keepalived 是一个免费开源的,用C编写.主要提供loadbalancing(负载均衡)和 high-availability(高可用)功能,负载均衡实现需要依赖Linux的虚拟服务 ...
- HTTP Status 404(The requested resource is not available)
这个问题之前在部署项目工程的时候经常遇见,今天我大致总结下出现这样的原因: 1.首先想到的是没有部署项目,但是你却在访问这个,这种不是很常见(对于老手). 2.其次是URL输入错误: 排错方法: 首先 ...
- Pycharm 中错误ImportError: No module named appium
Q: Pycharm 中错误ImportError: No module named appium A: Pycharm IDE Preferences -> Project Interpret ...
- JAVA NIO 简介 (netty源码死磕1.1)
[基础篇]netty 源码死磕1.1: JAVA NIO简介 1. JAVA NIO简介 Java 中 New I/O类库 是由 Java 1.4 引进的异步 IO.由于之前老的I/O类库是阻塞I/ ...