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 ...
随机推荐
- php使用imagick模块实现图片缩放、裁剪、压缩示例
PHP 使用Imagick模块 缩放,裁剪,压缩图片 包括gif图片 缩放 裁剪 复制代码代码如下: /** * 图片裁剪 * 裁剪规则: * 1. 高度为空或为零 按宽度缩放 高度自适 ...
- 使用虚拟环境 virtualenv
1.安装 $ sudo apt-get install python-virtualenv 2.重命名,一般虚拟环境会被命名为venv $ virtualenv venv 3. 激活 $ sour ...
- Java 异常介绍
Java标准库内建了一些通用的异常,这些类以 Throwable 为顶层父类.Throwable又派生出 Error 类和 Exception 类. 错误:Error类以及他的子类的实例,代表了JVM ...
- Centos date 设置自定义时间
[1]手动修改 (1)设置日期 # date -s 20190315 (2)设置时间 # date -s 15:23:34 (3)设置日期和时间 # date -s "20190315 15 ...
- [root@localhost ~]#各项解释
[root@localhost ~]# 解释: [登录用户@主机名 索引目录(~家目录,当前所在的目录)]#号代表超级用户,$普通用户
- 爬虫入门【6】Selenium用法简介
Selenium 是什么? 一句话,自动化测试工具.它支持各种浏览器,包括 Chrome,Safari,Firefox 等主流界面式浏览器. 如果你在这些浏览器里面安装一个 Selenium 的插件, ...
- (比赛)B - Super Mobile Charger
B - Super Mobile Charger Time Limit:1000MS Memory Limit:32768KB 64bit IO Format:%I64d & ...
- EasyDSS流媒体服务器软件对数据库Sqlite3和MySQL的同时支持说明
EasyDSS流媒体音视频直播与点播服务器软件,是一套提供一站式的转码.点播.直播.检索.回放.录像下载服务的高性能RTMP/HLS/HTTP-FLV流媒体服务,极大地简化了流媒体相关业务的开发和集成 ...
- 九度OJ 1194:八进制 (进制转换)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:3521 解决:2058 题目描述: 输入一个整数,将其转换成八进制数输出. 输入: 输入包括一个整数N(0<=N<=100000 ...
- 【python】-- 函数、无参/有参参数、全局变量/局部变量
函数 函数是组织好的,可重复使用的,用来实现单一,或相关联功能的代码段. 函数能提高应用的模块性,和代码的重复利用率.你已经知道Python提供了许多内建函数,比如print().但你也可以自己创建函 ...