VML学习(一)

1、什么是VML

请百度

2.、VML有何用处

请百度

3、简单例子

IE下:

<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>第一个VML范例</title>
<style>
  v\:* { Behavior: url(#default#VML) }
  o\:* { behavior: url(#default#VML) }
</style>
</head>

<body>
<v:line style="z-index:5;position:absolute;left:233;top:150" from="0,0" to="200,0" strokecolor="#aaaaaa"/>
<v:line style="z-index:5;position:absolute;" from="0,205" to="205,205" strokecolor="#aafaaa"/>
	<div id="divID" style="display: block;">
	<canvas id="tutorial" width="1893" height="811" style="top: 370px; left: 19px; position: absolute;"></canvas>
	</div>
	<table border="1">
		<tr>
			<td>02</td><td id="td0">03</td><td>04</td>
		</tr>
		<tr>
			<td>02</td><td>03</td><td id="td1">04</td>
		</tr><tr>
			<td id="td2">02</td><td>03</td><td>04</td>
		</tr>
	</table>	
	<script type="text/javascript">
		var Icolor="#aafaaa";
		var strHtml="";
		function testtt()
		{
			var  width=11; 
			var tb = document.getElementById("td0");
			var tb2 = document.getElementById("td1");
			var tb3 = document.getElementById("td2"); 
				var x1 = tb.offsetLeft;
				var y1 = tb.offsetTop;
				var x2 = tb2.offsetLeft;
				var y2 = tb2.offsetTop; 
				var x3 = tb3.offsetLeft;
				var y3 = tb3.offsetTop; 
			 	x1 = x1 + width; 
			 	x2 = x2 + width; 
			 	x3 = x3 + width; 
			  y1 = y1 + width;
			  y2 = y2 + width;
			  y3 = y3 + width;
				this.IELine(x1, y1, x2, y2); 
				this.IELine(  x2, y2,x3,y3); 
				document.getElementById('divID').innerHTML = strHtml;
		}
		function IELine(x1, y1, x2, y2) { 
			 strHtml+="<v:line style='z-index:5;position:absolute;' strokecolor=" + Icolor + " from='" + x1 + "px," + y1+ "px' to='" + x2 + "px," + y2 + "px'/>";
		}
		testtt();
		</script>
</body>
</html>


 

 

 

发布了73 篇原创文章 · 获赞 16 · 访问量 47万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览