- <HTML xmlns:v>
- <HEAD>
- <META http-equiv='Content-Type' content='text/html;charset=gb2312'>
- <Meta name='Gemeratpr' content='网络程序员伴侣(Lshdic)2005'>
- <TITLE>VML最简实现铅笔绘图功能</TITLE>
- <STYLE>
- v/:*{behavior:url(#default#VML);} /*声明V为VML变量*/
- </STYLE>
- </HEAD>
- <body bgcolor=black>
- <div id=div1 style="background-color:white;width:400;height:400"></div><br><input type=button value="清空" onclick="div1.innerHTML=''">
- <script> //作者:风云舞
- var xx=0,yy=0,oldvalue="",poly1,zz=1
- function div1.onmousedown(){ //鼠标按下
- if(event.button==1){
- div1.setCapture() //画笔绘画开始,锁定鼠标
- color1="red" //定义画笔基本颜色
- size1=1 //定义画笔基本粗度
- xx=event.x;yy=event.y;zz+=1 //定义基本起始坐标,zz是第三维,默认递增
- poly1=div1.appendChild(document.createElement("<v:shape filled=false path='m0,0 l0,0' style='position:absolute;z-index:"+zz+";left:"+xx+";top:"+yy+";width:100;height:100' strokecolor='"+color1+"' strokeweight='"+size1+"' coordsize='100,100'/>"))
- oldvalue=poly1.path.value.replace("e","")
- }}
- function div1.onmousemove(){ //鼠标移动
- if(event.button==1){
- if(event.srcElement.tagName=="BODY"){div1.releaseCapture();return false}
- oldvalue+=","+(event.x-xx)+","+(event.y-yy);poly1.path.value=oldvalue
- poly1poly1.path.value=poly1.path.value.replace(",0,",",").replace(",0 e","e")
- }}
- function div1.onmouseup(){ //鼠标弹起
- div1.releaseCapture();
- }
- </script>
vml 实现画笔
最新推荐文章于 2022-04-12 11:05:07 发布