html页面代码,里面的js就不说了,是画图用的。目的很简单就是以html页面中的“search.png”这个小图标为圆心,100px为半径画圆。肯定要设计绝对定位和相对定位,该怎么处理?
以下代码可供参考:
-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
-
<HTML>
-
<HEAD>
-
<TITLE>test </TITLE>
-
<SCRIPT type="text/javascript" LANGUAGE="JavaScript" src="js/wz_jsgraphics.js">
-
</SCRIPT>
-
<script type="text/javascript">
-
<!--
-
function draw(){
-
var cnv = document.getElementById("maps");
-
var jg = new jsGraphics(cnv);jg.setStroke(4);
-
jg.setColor("#ff0000"); // red
-
jg.drawEllipse(160, 160, 100, 100);
-
jg.paint();
-
}
-
//-->
-
</script>
-
</HEAD>
-
<BODY>
-
<div id="maps">
-
<div id="test" style="background-color:yellow; left:0px; top:0px; width:100px; height:100px; position: relative;">
-
<input value="drawCircle" onclick="draw();" type="button">
-
<div style="left:200px; top:200px;position: absolute;" >
-
<div style="background-color:red; width:20px; height:20px; z-index:10000; position: relative;">
-
<IMG SRC="search.png" WIDTH="16" HEIGHT="16">
-
</div>
-
<div style="background-color:orange; left:-40px; top:-40px; width:100px; height:100px; position: absolute;">
-
</div>
-
</div>
-
</div>
-
</div>
-
</BODY>
-
</HTML>
阅读(252) | 评论(0) | 转发(0) |