动态改变绝对位置
前台代码：
代码
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>无标题文档</title>
6 <style type="text/css">
7 #myTable
8 {
9 position:absolute;
10 background-color:blue;
11 }
12
13 p
14 {
15 font-size:12px;
16 color:yellow;
17 width:100;
18 height:30;
19 background-color:blue;
20 }
21
22
23
24 </style>
25
26 <script src="show.js" >
27
28
29
30 </script>
31
32 </head>
33
34 <body>
35 <p onmouseout="hideITable()" onmouseover="showITable('displayClock.html')">displayClock.html</p>
36 <p onmouseout="hideITable()" onmouseover="showITable('all.html')">all.html</p>
37 <table id="myTable" style="visibility:hidden" border="2">
38 <tr>
39 <td>
40 <iframe id="ishow" width="300" height="200" src="displayClock.html">
41 </iframe>
42 </td>
43
44 </tr>
45 </table>
46 </body>
47 </html>
48
49
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>无标题文档</title>
6 <style type="text/css">
7 #myTable
8 {
9 position:absolute;
10 background-color:blue;
11 }
12
13 p
14 {
15 font-size:12px;
16 color:yellow;
17 width:100;
18 height:30;
19 background-color:blue;
20 }
21
22
23
24 </style>
25
26 <script src="show.js" >
27
28
29
30 </script>
31
32 </head>
33
34 <body>
35 <p onmouseout="hideITable()" onmouseover="showITable('displayClock.html')">displayClock.html</p>
36 <p onmouseout="hideITable()" onmouseover="showITable('all.html')">all.html</p>
37 <table id="myTable" style="visibility:hidden" border="2">
38 <tr>
39 <td>
40 <iframe id="ishow" width="300" height="200" src="displayClock.html">
41 </iframe>
42 </td>
43
44 </tr>
45 </table>
46 </body>
47 </html>
48
49
js文件
代码
1 // JavaScript Document
2 function hideITable()
3 {
4 myTable.style.visibility = 'hidden';
5
6 }
7
8 function showITable(strFile)
9 {
10 myTable.style.visibility = '';
11 myTable.style.left = event.clientX;
12 myTable.style.top = event.clientY;
13 document.all.ishow.src = strFile;
14 }
2 function hideITable()
3 {
4 myTable.style.visibility = 'hidden';
5
6 }
7
8 function showITable(strFile)
9 {
10 myTable.style.visibility = '';
11 myTable.style.left = event.clientX;
12 myTable.style.top = event.clientY;
13 document.all.ishow.src = strFile;
14 }
应用前景：类似据ajax的效果，不过，画面是得刷新的。
