📄 14-7 “matrix”滤镜.htm
字号:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=GB2312" />
<title>14-7 “Matrix”滤镜</title>
<style>
* { font-size:12px; font-family:宋体, Arial; } /*规定了所有的字体样式*/
body { overflow:auto; }
#hutia { height:200px; filter:progid:DXImageTransform.Microsoft.Matrix(); }
</style>
<script>
//定义全局变量，为角度至弧度的变换系数
var deg2radians = Math.PI * 2 / 360;
//对象在调用下面函数前，应已应用“Matrix”滤镜
//参数“deg”为需要旋转的角度
function fnRotate(obj, deg){
//将角度转换为弧度
rad = deg * deg2radians ;
//计算正弦和余弦值
costheta = Math.cos(rad);
sintheta = Math.sin(rad);
//进行线性变换
obj.filters[0].M11 = costheta;
obj.filters[0].M12 = -sintheta;
obj.filters[0].M21 = sintheta;
obj.filters[0].M22 = costheta;
}
function $(str){ return(document.getElementById(str)); }
window.onload = function(){
fnRotate($("hutia"), 40);
$("hutia").onmouseover = function(){ fnRotate(this, 0); }
$("hutia").onmouseout = function(){ fnRotate(this, 40); }
}
</script>
</head>
<body>
<img id="hutia" src="..\inc\img\14-7.jpg">
</body>
</html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -