vml 动态画多边形

最新推荐文章于 2018-05-10 22:55:47 发布

w375179337

最新推荐文章于 2018-05-10 22:55:47 发布

阅读量964

点赞数

分类专栏： vml 文章标签： function null javascript behavior div filter

本文链接：https://blog.csdn.net/w375179337/article/details/5664487

版权

vml 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<HTML xmlns:v>
<head>
<title>手绘多边形</title>
<meta name="ContentType" content="text/html" />
<meta name="CharSet" content="GB2312" />
<style type="text/css">
v/:* {behavior:url(#default#VML);}
</style>
<script language="javascript">
var Working=false;//判断是否画图的状态
var poly1=null,oldvalue="",oldx=0,oldy=0 //为了完成铅笔、记忆点等连续线段
var xx,yy;
//鼠标单击事件
function divMousedown()
{
if(!Working)//第一次点击鼠标
{
  xx=event.x;
  yy=event.y;
  poly1=div1.appendChild(document.createElement("<v:shape path='m0,0 l0,0' filled='true' style='POSITION:absolute;z-index:1;left:"+xx+";top:"+yy+";width:100;height:100;filter: Alpha(Opacity=60);' strokecolor='black' strokeweight='1' coordsize='100,100' fillcolor='yellow'/>"));
  oldvalue=poly1.path.value.replace("e","");
  oldx=xx;
  oldy=yy;
  Working=true;
}
else
{
  if (poly1!=null) oldvalue=poly1.path.value.replace(" e","");
}
}
//鼠标移动的时候
function divMouseMove()
{
  tempx=event.x;
  tempy=event.y;
  if (poly1!=null)
  {
   poly1.path.value=oldvalue+","+(tempx-oldx)+","+(tempy-oldy);
   poly1.path.value=poly1.path.value.replace(",0,0,",",0,").replace(",0 e","e");
  }
}

function divMouseUp()
{
  if(event.button==2)
  {
   poly1.path.value=oldvalue+"x e";
   Working=false;
   poly1=null;
  }
}
</script>
<body style="margin:0px;">
<div id="div1" style="position:absolute; height:100%; width:100%; border:1px solid 0000FF;" οnmοusedοwn="divMousedown();" οnmοusemοve="divMouseMove();" οnmοuseup="divMouseUp();" οncοntextmenu="return false;">在页面上点击鼠标左键开始，右击鼠标右键结束</div>
</body>
</html>

这里画

在页面上点击鼠标左键开始，右击鼠标右键结束

w375179337

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vml 动态画多边形

<br /><HTML xmlns:v><br /> <head><br /> <title>手绘多边形</title><br /> <meta name="ContentType" content="text/html" /><br /> <meta name="CharSet" content="GB2312" /><br /> <style type="text/css"><br /> v/:* {behavior:url(#default#VML);}<br /> </style><b
复制链接

扫一扫

专栏目录