Dom中有多种定位属性，下面是一个简单案例
1 <html><!--制作一个会跟着鼠标走的图像，还有控件定位的案例-->
2 <head>
3 <title>document practise</title>
4 <script type="text/javascript">
5 //document.onclick=function(){alert("点击网页了！");}
6 function increWidth() {
7 var oldwidth = document.getElementById("1").style.width;
8 oldwidth = parseInt(oldwidth) + 50;
9 document.getElementById("1").style.width = oldwidth.toString() + "px";
10 }
11 document.onmousemove = function () {
12 var x = window.event.clientX;
13 var y = window.event.clientY;
14 var divfly = document.getElementById("fly");
15 //if (!divfly) return;
16 divfly.style.left = x.toString()+"px";
17 divfly.style.top= y.toString()+"px";
18 }
19
20 </script>
21 </head>
22 <body>
23 <input type="button" value="单位" id="1" style="width:50%" /><br />
24 <input type="button" value="获取单位长度" onclick="alert(document.getElementById(‘1‘).style.width)" /><br />
25 <input type="button" value="设置单位长度" onclick="document.getElementById(‘1‘).style.width=‘50px‘" />
26 <input type="button" value="加宽50" onclick="increWidth()" />
27 <input type="button" value="定位" style="position:fixed;bottom:200px;right:200px;" />
28 <div id="fly" style="position:absolute">
29 <img src="../images/front.jpg" width="100" height="120" />
30 </div>
31 </body>
32 </html>
时间： 2024-10-10 23:03:14