java rotate怎么用_jQuery旋转插件jqueryrotate用法详解

本文实例讲述了jQuery旋转插件jqueryrotate用法。分享给大家供大家参考,具体如下:

CSS3 提供了多种变形效果,比如矩阵变形、位移、缩放、旋转和倾斜等等,让页面更加生动活泼有趣,不再一动不动。然后 IE10 以下版本的浏览器不支持 CSS3 变形,虽然 IE 有私有属性滤镜(filter),但不全面,而且效果和性能都不好。

今天介绍一款 jQuery 插件——jqueryrotate,它可以实现旋转效果。jqueryrotate 支持所有主流浏览器,包括 IE6。如果你想在低版本的 IE 中实现旋转效果,那么 jqueryrotate 是一个很好的选择。

兼容性

jqueryrotate 支持所有主流浏览器,包括 IE6。jqueryrotate 在高级浏览器中使用 CSS3 transform 属性实现,在低版本 IE 中使用 VML 实现。当然,你可以使用 IE 条件注释,低版本 IE 使用 jqueryrotate,高级浏览器则直接使用 CSS3。

使用方法

//演示1

//旋转45angle

$(document.body).click(function () {

//方式1

$('.divOne').rotate(45);

//方式2

$('.divOne').rotate({ angle: 45 });

});

//演示2

//鼠标移动效果

//方式1

$('.divOne').rotate({

bind: {

mouseover: function () {

$(this).rotate({ animateTo: 180 });

},

mouseout: function () {

$(this).rotate({ animateTo: 0 });

}

}

});

//方式2

$('.divOne').mouseover(function () {

$(this).rotate({ animateTo: 180 });

}).mouseout(function () {

$(this).rotate({animateTo:0});

});

//演示3 不停旋转

//方式1

var angle = 0;

setInterval(function () {

angle += 3;

$('.divOne').rotate(angle);

}, 50);

//方式2

var rotation = function () {

$('.divOne').rotate({

angle: 0,

animateTo: 360,

callback:rotation

})

}

rotation();

//方式3

var rotation = function () {

$('.divOne').rotate({

angle: 0,

animateTo: 360,

callback: rotation,

easing: function (x, t, b, c, d) {

return c * (t / d) + b;

}

})

}

rotation();

//演示4 点击旋转

//方式1

$('.divOne').click(function () {

$(this).rotate({

angle: 0,

animateTo: 180,

easing: $.easing.easeInOutExpo

});

});

var val = 0;

$('.divOne').click(function () {

val += 90;

$(this).rotate({

animateTo: val

});

});

参数

参数

类型

说明

默认值

angle

数字

旋转一个角度

0

animateTo

数字

从当前的角度旋转到多少度

0

step

函数

每个动画步骤中执行的回调函数,当前角度值作为该函数的第一个参数

easing

函数

自定义旋转速度、旋转效果,需要使用 jQuery.easing.js

duration

整数

旋转持续时间,以毫秒为单位

callback

函数

旋转完成后的回调函数

getRotateAngle

函数

返回旋转对象当前的角度

stopRotate

函数

停止旋转

演示虽然使用的是图片,但 jqueryrotate 并不只是能运用在图片上,其他元素如 div 等也可以使用。同时,你可以发挥想象,制作出更多关于旋转的特效。

希望本文所述对大家jQuery程序设计有所帮助。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/337877.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

c语言野指针产生的原因

点击上方蓝字关注我,了解更多咨询1、指针变量未初始化,任何指针变量刚被创建时不会自动成为 NULL 指针,它的缺省值是随机的。所以,指针变量在创建的同时应当被初始化,要么将指针设置为 NULL ,要么让它指向合…

java rhino_在Java 8中使用Rhino

java rhinoJava将Nashorn作为JSR 223的新JavaScript实现(javax.scripting)。 尽管这无疑是个好消息(通过直接生成Java代码,Nashorn比Rhino快得多),但它也带来了一些挑战: Nashorn与Rhino并非10…

docx 图片预处理 Java_如何在java中将docx文件头图像复制到另一个docx文件中

尝试(未经测试的):void attachHeader(HeaderPart sourcePart, WordprocessingMLPackage targetPkg) throws Docx4JException {HeaderPart newHeaderPart new HeaderPart();newHeaderPart.setContents(XmlUtils.deepCopy(sourcePart.getContents()));if (sourcePart.getRelatio…

c语言中assert函数的使用注意

点击上方蓝字关注我,了解更多咨询1、使用assert检查函数开始时传入参数的合法性。2、每个assert只检验一个条件,因为在同时检验多个条件时,如果断言失败,就无法直观地判断哪个条件失败。实例int resetBufferSize(int nNewSize) {/…

es 调整gc_实际中进行GC调整

es 调整gc调优垃圾回收与任何其他性能调优活动没有什么不同。 您需要确保您了解当前的情况和所需的结果,而不是因为对应用程序的随机部分进行调整而产生了诱惑。 通常,只需执行以下过程即可: 陈述您的绩效目标 运行测试 测量 与目标比较…

game connect4 java_为我的connect 4数学游戏创建一个积分系统

我试着在每次用户得到正确答案时加一分,如果在我的“连接4”数学游戏中答错了,我就拿走一分。在游戏中,用户把一个计数器放在想要的地方,问题就会弹出,等待答案,以便继续。这段代码中的所有内容都能正常工作…

内核中断处理流程_处理中断

内核中断处理流程我只是在观看Heinz Kabutz的VJUG采访 ,这启发了我写一篇有关中断的文章。 顺便说一句,我建议您订阅VJUG YouTube频道 -确实非常有用。 Heinz始终是物有所值的,很难不学习很多东西就很难观看他的演讲。 他提出了如何处理Inte…

c语言中assert函数是什么

点击上方蓝字关注我,了解更多咨询1、assert将通过检查表达式expresion的值来决定是否需要终止执行程序。2、如果表达式expresion的值是假的(即0),它将首先向标准错误流stderr打印错误信息。通过调用abort函数终止程序运行。否则,assert没有效…

java怎么清空一个文件内容_如何从文本文件中删除特定内容? - java

我正在Java的SO的帮助下从事此项目的工作,正在读取一个文件夹,然后将其内容写入文件。然后,我需要浏览该内容,仅保留末尾带有Thumbnail.jpg的图像。编辑:public static final File outFile new File(System.getProper…

sci检索没有馆藏号_转变馆藏

sci检索没有馆藏号您是否曾经想替换过HashSet或HashMap使用的equals和hashCode方法? 或者有一个List的一些元素类型伪装成的List相关类型的? 转换集合使这成为可能,并且本文将展示如何实现。 总览 转换集合是LibFX 0.3.0的一项功能&#xf…

c语言中exit和return的区别

点击上方蓝字关注我,了解更多咨询1、返回函数值的return是关键字,exit是一个函数。return是语言级的,它表示调用堆栈的返回;exit是系统调用级的,它表示一个过程的结束。2、return是函数的退出,exit是进程的…

java怎样返回json_java怎么返回json

详细内容本篇文章将介绍如何编写Java程序来返回Json数据,本次以三个方式进行介绍。推荐课程:Java教程,方式1:当然是手敲所有代码,来进行json数据的返回。需要 HttpHttpServletRequest request HttpServletResponse res…

junit测试类叫什么名字_使用Junit测试名称

junit测试类叫什么名字命名测试 当我们创建Junit测试时,通常没有方法名称的实际使用。 Junit运行器使用反射来发现测试方法,并且从版本4开始,您不再被限制以test开始方法的名称。 测试方法的名称用于文档目的。 人们遵循不同的风格。 您可以…

c语言中realloc函数是什么

点击上方蓝字关注我,了解更多咨询1、判断当前指针是否有足够的连续空间。如果足够,扩大ptr指向的地址并返回。如果不够,如何根据size指定的大小分配空间,将原始数据复制到新分配的内存中,然后释放原始ptr指向的区域。2…

java 暂停循环_java小白关于while死循环时处理办法的一发求助帖

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼package greedsnake;import java.awt.Color;import java.awt.Font;import java.awt.Frame;import java.awt.Graphics;import java.awt.Image;import java.awt.event.KeyAdapter;import java.awt.event.KeyEvent;import java.awt.ev…

java jsp学习指南_JSP教程–最终指南

java jsp学习指南编者注: JavaServer Pages(JSP)技术使您可以轻松创建同时包含静态和动态组件的Web内容。 JSP技术提供了Java Servlet技术的所有动态功能,但提供了一种更自然的方法来创建静态内容。 JSP技术的主要功能包括用于开…

c语言中main函数是什么

点击上方蓝字关注我,了解更多咨询1、main函数是C程序的入口函数,即程序的执行从main函数开始,其他函数的调动也直接或间接地在main函数中调用。2、main函数的返回值用于解释程序的退出状态。若返回0,则表示程序正常退出。返回其他…

什么是通用字符名称?_通用名称

什么是通用字符名称&#xff1f;泛型类型参数名称通常包含一个大写字母字符。 如果您开始阅读有关泛型的官方ORACLE文档&#xff0c;则第一个示例是 /*** Generic version of the Box class.* param <T> the type of the value being boxed*/ public class Box<T>…

c语言中__cplusplus是什么

点击上方蓝字关注我&#xff0c;了解更多咨询1、__cplusplus和extern“C”一般都是配对使用&#xff0c;如果定义了__cplusplus(cpp文件默认定义了该宏)&#xff0c;则采用C语言方式进行编译。2、是在C中特有的&#xff0c;__cplusplus 其实就是C。实例#ifndef __CODERSRC_H__ …

git rollback代码都没了_git回滚线上代码

由于之前自己推代码的时候操作失误&#xff0c;才push代码的时候没有push到dev分支&#xff0c;而是push到了本地master同名分支的线上master分支&#xff0c;覆盖掉了线上在用的代码。在搜索解决办法的时候&#xff0c;发现网上给的信息大多不够全&#xff0c;且很多无用。所以…