大家好，小弟我又有问题了，这几天自学javascript看到了CSS。我想做个像淘宝那样的功能，鼠标移到一个商品的图标上的时候会在图标边上显示出一个提示页面，写些商品信息什么的，但是商品众多的情况下不可能一个一个图片的去设置提示页面的位置，所以我写了个取得图标的位置（left，top），然后赋值给提示页面的位置（当然要经过处理才赋值，不然重合了）。问题就在于，我写function取不到图标的位置，不知道问题出在哪里，下面是详细代码，我简化过了（本来很多图片的，代码中就一个图片），代码存在同样的问题，问题的地方我用注释标明了，请各位大侠帮我看看，这段时间我很认真的在学这个，也得到了很多论坛里朋友的帮助，先感谢一下。
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>My JSP 'JavaScript_Test.jsp' starting page</title>
<style type="text/css">
.mytable {
position: absolute; /*废了老大劲，才知道不能重设置table的位置的原因是这句没写*/
font-size: 14pt
}
</style>
<script type="text/javascript">
function showinfo(o) {
mytable.style.visibility = '';
var X = window.event.x;
var Y = window.event.y;
mytable.style.left = X;
mytable.style.top = Y;
P1.src = "1.jpg";
var divX=o.style.left;
var divY=o.style.top;
myX.value=divX;
myY.value=divY;
}
function hiddentable() {
P1.src = "";/*这句必须写，当鼠标从O1移开之后，假设S2没有图片资源赋值给P1，那么P1默认情况的图片资源还是O1赋值的图片*/
mytable.style.visibility = 'hidden';
}
</script>
</head>
<body>
<table id="info" width="120pt" height="120pt" align="center"
border="3px">
<tr valign="middle" height="20%">
<td width="56%" align="left" valign="top">
<div id="O1" onmouseover="showinfo(this)"
onmouseout="hiddentable()" >
<img src="1.jpg" alt="" width="90" height="67pt"
name="img1" />
</div>
</td>
<td>
</td>
</tr>
</table>
<table id="mytable" style="visibility: hidden" class="mytable">
<tr>
<td>
<img alt="" id=P1 width="270px" height="200" />
</td>
</tr> </table>
<HR>
X:<input type="text" readonly="readonly" name=myX>
Y:<input type="text" readonly="readonly" name=myY>
</body>
</html>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>"> <title>My JSP 'JavaScript_Test.jsp' starting page</title>
<style type="text/css">
.mytable {
position: absolute; /*废了老大劲，才知道不能重设置table的位置的原因是这句没写*/
font-size: 14pt
}
</style>
<script type="text/javascript">
function showinfo(o) {
mytable.style.visibility = '';
var X = window.event.x;
var Y = window.event.y;
mytable.style.left = X;
mytable.style.top = Y;
P1.src = "1.jpg";
var divX=o.style.left;
var divY=o.style.top;
myX.value=divX;
myY.value=divY;
}
function hiddentable() {
P1.src = "";/*这句必须写，当鼠标从O1移开之后，假设S2没有图片资源赋值给P1，那么P1默认情况的图片资源还是O1赋值的图片*/
mytable.style.visibility = 'hidden';
}
</script>
</head>
<body>
<table id="info" width="120pt" height="120pt" align="center"
border="3px">
<tr valign="middle" height="20%">
<td width="56%" align="left" valign="top">
<div id="O1" onmouseover="showinfo(this)"
onmouseout="hiddentable()" >
<img src="1.jpg" alt="" width="90" height="67pt"
name="img1" />
</div>
</td>
<td>
</td>
</tr>
</table>
<table id="mytable" style="visibility: hidden" class="mytable">
<tr>
<td>
<img alt="" id=P1 width="270px" height="200" />
</td>
</tr> </table>
<HR>
X:<input type="text" readonly="readonly" name=myX>
Y:<input type="text" readonly="readonly" name=myY>
</body>
</html>
第一个问题：
var divX=o.style.left;
var divY=o.style.top;
这两句取不到o的（left，top）值，也就是我指定的标签的值。
第二个问题：
<table id="mytable" style="visibility: hidden" class="mytable">
我在这里申明了table的visibility属性是hidden，可能有人疑问，为什么后面用到了CSS样式，还要把这句visibility拎出来写呢，其实是这样的，当我在上面的CSS类mytable中写到visibility：hidden的时候，就会出现问题，等我把鼠标移动到div id=O1上的时候是不会显示出mytable这个表格的（我这边CSS样式名和table名重名了，大家应该能看的懂，嘿嘿）。只有在table的属性里设置visibility为hidden。这就是我的第二个问题，为什么在table的CSS样式类中设置的时候显示不table来。
第三点：
提示大家一下，代码中的两个注释是我自己在测试的时候写的，大家不要理会。
用offsetleft然后循环累加即可得出还有visibility:hidden;这样写是可以的啊还有注意结束标签<input />