现在的位置: 首页 > 综合 > 正文

VML之带背景的3D图形任意旋转

2013年11月02日 ⁄ 综合 ⁄ 共 1004字 ⁄ 字号 评论关闭
利用VML及JS实现在shape上带有背景图象并可以任意旋,并具有及3D效果,
注:如果IE上不能显示VML,需要下载vgx.dll并regsvr32即可!

<script>

function SetRotation(deg)
{
 var deg2rad=Math.PI*2/360;
 rad=deg*deg2rad;
 costheta = Math.cos(rad);
 sintheta = Math.sin(rad);
 var oDiv=document.all("r1"); 
 with (oDiv.filters.item(0))
 {
  M11=costheta;
  M12=-sintheta;
  M21=sintheta;
  M22=costheta;    
 }
}

 </script>
<center>
<?import namespace = v urn = "urn:schemas-microsoft-com:vml" implementation = "#default#VML" declareNamespace />
<table>
 <tr><td>
<input type=text value=40 id=txtangle>
<input type=button onclick="SetRotation(document.all.txtangle.value);" value="rotate">
</td></tr>
 <tr><td>
<v:shape id=r1 style="filter:progid:DXImageTransform.Microsoft.Matrix(M11=1.0, sizingmethod='auto expand');
 Z-INDEX:1;WIDTH:200;HEIGHT:500" coordsize="100,100" filled="t" strokecolor="blue" path="m0,0 l30,30,60,0,0,0 e">
 <v:extrusion on="t" backdepth="20pt" color="white" diffusity="1" rotationangle="100,-100" />
<v:fill src="http://www.baidu.com/img/logo.gif" type="frame" opacity="1"/>
</v:shape>
</td></tr>
</table>
</center>

抱歉!评论已关闭.