插代码 。。

  1. <%@ page language="java" contentType="text/html; charset=UTF-8"
    2. 

  2.     pageEncoding="UTF-8"%>
    3. 

  3. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    4. 

  4. <html>
    5. 

  5. <head>
    6. 

  6. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    7. 

  7. <script type="text/javascript" src="/js/jquery-1.9.1.min.js"></script>
    8. 

  8. <script type="text/javascript" src="/js/jQueryRotate.js"></script>
    9. 

  9. <title>Insert title here</title>
    10. 

  10. </head>
    11. 

    12. 

  12. <body>
    13. 

  13. 	<div id="imgdiv" style="width: 200px;height: 300px;vertical-align: middle;margin-top: 100px;">
    14. 

  14. 		<input type="button" value="关闭" style="float: right;" onclick="closedImageDiv()"/>
    15. 

  15. 		<img id="image" alt="Penguins.jpg" src="Penguins.jpg" style="width: 200px;height: 300px;z-index: 0">
    16. 

  16. 		<input type="button" value="旋转90°" onclick="imagerotete()" style="float: right;">
    17. 

  17. 	</div>
    18. 

    19. 

    20. 

  20. </body>
    21. 

  21. <script type="text/javascript">
    22. 

  22. 	 $(function(){
    23. 

  23. 		 	/* var angle = 0;
    24. 

  24. 		    setInterval(function(){
    25. 

  25. 		        angle += 3;
    26. 

  26. 		        $("#image").rotate(angle);
    27. 

  27. 		    }, 50); */
    28. 

  28. 		    
    29. 

  29. 		
    30. 

  30. 	 });
    31. 

  31. 	 
    32. 

  32. 	 function imagerotete(){
    33. 

  33. 		var angle=0;
    34. 

  34. 		 angle+=90;
    35. 

  35. 		 if(angle>360){
    36. 

  36. 			 angle=0;
    37. 

  37. 		 }
    38. 

  38. 		 $("#image").rotate({
    39. 

  39. 	    	 angle: angle-90<0?0:angle-90,
    40. 

  40. 	         animateTo: angle
    41. 

  41. 	    });
    42. 

  42. 	 }
    43. 

  43. 	 
    44. 

  44. 	 function closedImageDiv(){
    45. 

  45. 		$("#imgdiv").remove();
    46. 

  46. 	 }
    47. 

  47. </script>
    48. 

  48. </html>




附件列表

js 旋转控件 jQueryRotate的更多相关文章

  1. js树形控件

    js树形控件 ztree http://www.treejs.cn/

  2. Atitit.js图表控件总结

    Atitit.js图表控件总结 1. 为什么要使用图表1 2. 图表分类1 3. 数据可视化的优点1 4. 流行的js图表类库1 5. 参考2 1. 为什么要使用图表 因为要可视化 2. 图表分类 条 ...

  3. js设置控件的隐藏与显示的两种方法

    js设置控件的隐藏与显示,设置控件style的display和visibility属性就可以了,下面有个示例,需要的朋友可以参考下用JavaScript隐藏控件的方法有两种,分别是通过设置控件的sty ...

  4. 简洁JS 日历控件 支持日期和月份选择

    原文出处 以下这个JS日历控件是我的闲暇之余自己编写的,所有的代码全部在IE7/IE8/Firefox下面测试通过, 而且可以解决被iframe层遮盖的问题.现在只提供两种风格(简洁版和古典版)和两种 ...

  5. JS日历控件优化(增加时分秒)

    JS日历控件优化      在今年7月份时候 写了一篇关于 "JS日历控件" 的文章 , 当时只支持 年月日 的日历控件,现在优化如下:      1. 在原基础上 支持 yyyy ...

  6. WPF编程，通过Double Animation动态旋转控件的一种方法。

    原文:WPF编程,通过Double Animation动态旋转控件的一种方法. 版权声明:我不生产代码,我只是代码的搬运工. https://blog.csdn.net/qq_43307934/art ...

  7. WPF编程，通过Double Animation同时动态缩放和旋转控件的一种方法。

    原文:WPF编程,通过Double Animation同时动态缩放和旋转控件的一种方法. 版权声明:我不生产代码,我只是代码的搬运工. https://blog.csdn.net/qq_4330793 ...

  8. js获取控件位置以及不同浏览器中的差别

    js获取控件位置(坐标位置)在不同浏览器中的差别. //获取坐标位置 function getpos(e) { var t=e.offsetTop; var l=e.offsetLeft; var h ...

  9. JS日历控件集合----附效果图、源代码

    http://www.cnblogs.com/yank/archive/2008/08/14/1267746.html 在进行开发的过程中,经常需要输入时间,特别是在进行查询.统计的时候,时间限定更为 ...

随机推荐

  1. git 命令02

    1.怎么添加远程库2.克隆一个远程库3.什么是分支管理4.什么是标签管理3.搭建git服务器 1.添加远程库.我以github官网上提供给用户注册https://github.com/,可以在官网了自 ...

  2. rootkit后门之安装流程

    1.首先是获得远程服务器的root权限 2.然后下载rootkit程序,本文用到的是mafix (下载前最好把杀毒软件关掉,基本上会报毒的!) 3.开始安装 tar -xvzf mafix.tar.g ...

  3. go语言基础之iota枚举

    1.iota (在常量的时候,当成枚举使用) 示例1 package main import "fmt" func main() { //1.iota常量自动生成器,每个一行,自动 ...

  4. scala 内部类

    scala内部类不同于java内部类, java类中内部类从属于外部类,而scala的内部类从属于外部类对象 /** * 第一种方式 * 在内部类通过 外部类.this.成员名称 访问外部类成员 */ ...

  5. 约瑟夫环形链表问题、丢手帕问题、剑指offer圆圈中最后一个数问题

    public class Solution { // 左神解法,本题本质还是报数为m-1的倍数的人死.求最后一个活着的人是初始时候的哪个人       /* 报数(A) 实际人员编号(B)      ...

  6. Akka概念集

    (转)http://www.csdn.net/article/2014-12-17/2823174 在Akka里面,和Actor通信的唯一方式就是通过ActorRef.ActorRef代表Actor的 ...

  7. [AngularJS] $interval

    $interval provides an excellent service for timed operations in your AngularJS apps. It has the adva ...

  8. EEPlat 与 SOA

    EEPlat具有良好的可集成性和高度的系统开放性. EEPlat中系统级的服务由业务对象的服务通过规则引擎定义的业务逻辑组织建立起来.系统级的服务和业务对象的服务都可以直接公布为WebService供 ...

  9. WebService 之 协议篇

    Web Service 使用的是 SOAP (Simple Object Access Protocol)简单对象访问协议,是交换数据的一种协议规范,是一种轻量的.简单的.基于XML(标准通用标记语言 ...

  10. 课程分享 企业普及版贝斯OA与工作流系统

    企业普及版贝斯OA与工作流系统 基于J2EE+JBPM3.x/JBPM4.3+Flex流程设计器+Jquery+授权认证企业普及版贝斯OA与工作流系统 假设对这个课程有兴趣的.能够和我联系.QQ205 ...