元素绕中心旋转
来源:互联网 发布:tcp套接字编程实例 编辑:程序博客网 时间:2024/04/29 21:08
<div style="position:relative; width:438px; height:438px; background-color:#F4F4F4;">
<div id="wc" style="position:absolute; left:119px; top:73px; width:200px; height:292px;">
<img src="http://www.cnblogs.com/images/cnblogs_com/wentomi/Untitled-2.jpg">
</div>
</div>
<script type="text/javascript">
//progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand')
var Revolve = {
object : null
, init : function (o, w) {
this.object = o;
this.width = w;
o.style.filter = "progid:DXImageTransform.Microsoft.Matrix()";
//设置滤镜的属性值
o.filters.item("DXImageTransform.Microsoft.Matrix").SizingMethod = "auto expand";
o.filters.item("DXImageTransform.Microsoft.Matrix").FilterType = "bilinear";
}
, revolve : function (n, f) {
var o = this.object, r, sin, cos;
n = (n + f) % 360;
r = n / (360 / (Math.PI * 2));
sin = Math.sin(r), cos = Math.cos(r);
with (o.filters.item("DXImageTransform.Microsoft.Matrix")) {
M11 = cos, M12 = -sin, M21 = sin, M22 = cos;
}
with (o.style) {
left = this.width / 2 - o.offsetWidth / 2;
top = this.width / 2 - o.offsetHeight / 2;
}
return n;
}
};
window.onload = function () {
if (!/MSIE/.test(window.navigator.userAgent)) return;
var o = document.getElementById("wc"), n = 0;
Revolve.init(o, 438);
o.timer = window.setInterval(function () {
n = Revolve.revolve(n, 20);
}, 50);
};
</script>
- 元素绕中心旋转
- 绕中心旋转的圆环
- java 图片绕中心旋转
- openCV 图像绕中心旋转
- 元素中心旋转在CSS3和IE滤镜中的实现
- 元素中心旋转在CSS3和IE滤镜中的实现
- FLEX里图片绕中心旋转
- Android中控件绕中心旋转动画
- 如何让一个点绕中心旋转
- Canvas改变原点绕中心旋转
- android,中心旋转
- opengl 旋转中心理解
- QGraphicItem实现中心旋转
- QGraphicItem实现中心旋转
- Android对图片进行旋转(绕图片中心)
- android圆形图片的获取与图片绕中心旋转
- Android-两个小球不停的绕中心旋转的进度条
- Android-两个小球不停的绕中心旋转的进度条
- Windows Vista MSDN简体中文版(32bit)
- FLY Windows XP Pro SP3 v3264 集成优化版 2.0
- 玄武湖之1月5日
- c语言指针详解
- 树形结构查询
- 元素绕中心旋转
- HashMyFiles v1.18
- XSL样式表
- gpg公钥验证错误的解决
- [转帖]Windows WorkFlow Foundation 入门
- 常用正则表达式收集
- Hibernate实现多表查询
- 寻求下面算法的破解方法
- 处理字符串的常用操作