在线请教，一个简单的小问题

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<style>
.div_style_hidden{
width:111px; 
height:111px; 
z-index:111;
BORDER-TOP: #6600FF 2px solid;
BORDER-BOTTOM: #6600FF 2px solid;
BORDER-LEFT: #6600FF 2px solid;
BORDER-RIGHT: #6600FF 2px solid;
}
</style>
<!-- 以下代码放到head间 ***注意pic/blank.jpg,close_down.jpg,close_over.jpg是必须的 -->
<SCRIPT>
var aaa_gg = ""; //格式:图片 id 加上 _gg ***注意这些变量必须定义(可以为空,为空时用默认值)
var bbb_gg = "";
function mouseover(obj) //图象的鼠标按下事件
{
var x;
var y;
x = window.event.x;
y = window.event.y;
document.all.div_style.style.visibility = 'visible';
document.all.div_style.style.left = x; 
document.all.div_style.style.top = y;
document.all.div_pic.src = obj.src;
if (eval(obj.id + "_gg")) {
document.all.td_jianjie.innerHTML = eval(obj.id + "_gg");
}
flash();
}
function mouseout(obj) //图象的鼠标移出事件
{
document.all.div_style.style.visibility = 'hidden';
}
function close_mousedown(obj) //叉号的鼠标按下事件
{
obj.src = 'http://expert.csdn.net/images/csdn.gif';
}
function close_mouseup(obj) //叉号的鼠标抬起事件
{
document.all.div_style.style.visibility = 'hidden';
obj.src = 'http://expert.csdn.net/images/csdn.gif';
}var light    = 0; //亮度
var time_out = null;
function flash() //渐变效果
{
light += 10;
if (light == 100) {
clearTimeout(time_out);
light = 0;
return;
}
document.all.div_pic.filters.alpha.opacity = 0 + light; //改变图片样式
time_out = setTimeout("flash()",100); //在此修改渐变时间
}
</SCRIPT>
<div id="div_style" class='div_style_hidden' style='position:absolute;visibility:hidden;left: 1in;top: 1in;background: url(); background-repeat: repeat;'> 
  <table  border="0" cellspacing="0" cellpadding="0">
    <tr> 
      <td width="60%"  align='center'><img src='http://expert.csdn.net/images/csdn.gif' id='div_pic' style="filter:alpha(opacity=0)"></td>
      <!-- 左 -->
      <td width="40%" > 
        <!-- 右 -->
        <table width="100%" height="100%" border="0">
          <tr width="100%" height="5%"> 
            <td width="71%">&nbsp;</td>
            <td width="29%"><img src='http://expert.csdn.net/images/csdn.gif' name='close' onMouseDown='close_mousedown(this)' onMouseUp='close_mouseup(this)' style='cursor:hand'></td>
            <!-- ×号按钮 -->
          </tr>
          <tr> 
            <td id='td_jianjie'><br></td>
            <!-- 产品简介(默认值) -->
          </tr>
        </table></td>
    </tr>
  </table>
</div>
</head>
<body> <img id='aaa' src='http://expert.csdn.net/images/csdn.gif' width="30" height="80" onmouseover='mouseover(this)' style='cursor:hand'> 
<img id='bbb' src='http://expert.csdn.net/images/csdn.gif' width="30" height="80" onmouseover='mouseover(this)' style='cursor:hand'> 
</body>
</html>

解决方案 »

  1.   

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>无标题文档</title>
    <style>
    .div_style_hidden{
    width:111px; 
    height:111px; 
    z-index:111;
    BORDER-TOP: #6600FF 2px solid;
    BORDER-BOTTOM: #6600FF 2px solid;
    BORDER-LEFT: #6600FF 2px solid;
    BORDER-RIGHT: #6600FF 2px solid;
    }
    </style>
    <!-- 以下代码放到head间 ***注意pic/blank.jpg,close_down.jpg,close_over.jpg是必须的 -->
    <SCRIPT>
    var aaa_gg = ""; //格式:图片 id 加上 _gg ***注意这些变量必须定义(可以为空,为空时用默认值)
    var bbb_gg = "";
    function mouseover(obj) //图象的鼠标按下事件
    {
    var x;
    var y;
    x = window.event.x;
    y = window.event.y;
    document.all.div_style.style.visibility = 'visible';
    document.all.div_style.style.left = x; 
    document.all.div_style.style.top = y;
    document.all.div_pic.src = obj.src;
    if (eval(obj.id + "_gg")) {
    document.all.td_jianjie.innerHTML = eval(obj.id + "_gg");
    }
    flash();
    }
    function mouseout(obj) //图象的鼠标移出事件
    {
    document.all.div_style.style.visibility = 'hidden';
    }
    function close_mousedown(obj) //叉号的鼠标按下事件
    {
    obj.src = 'http://expert.csdn.net/images/csdn.gif';
    }
    function close_mouseup(obj) //叉号的鼠标抬起事件
    {
    document.all.div_style.style.visibility = 'hidden';
    obj.src = 'pic/close_over.jpg';
    }var light    = 0; //亮度
    var time_out = null;
    function flash() //渐变效果
    {
    light += 10;
    if (light == 100) {
    clearTimeout(time_out);
    light = 0;
    return;
    }
    document.all.div_pic.filters.alpha.opacity = 0 + light; //改变图片样式
    time_out = setTimeout("flash()",100); //在此修改渐变时间
    }
    function onmouseout(o)
    {
    document.all.div_style.style.visibility = 'hidden';
    }
    </SCRIPT>
    <div id="div_style" class='div_style_hidden' style='position:absolute;visibility:hidden;left: 1in;top: 1in;background: url("pic/blank.jpg"); background-repeat: repeat;'> 
      <table  border="0" cellspacing="0" cellpadding="0">
        <tr> 
          <td width="60%"  align='center'><img src='' id='div_pic' style="filter:alpha(opacity=0)"></td>
          <!-- 左 -->
          <td width="40%" > 
            <!-- 右 -->
            <table width="100%" height="100%" border="0">
              <tr width="100%" height="5%"> 
                <td width="71%">&nbsp;</td>
                <td width="29%"><img src='pic/close_over.jpg' name='close' onMouseDown='close_mousedown(this)' onMouseUp='close_mouseup(this)' style='cursor:hand'></td>
                <!-- ×号按钮 -->
              </tr>
              <tr> 
                <td id='td_jianjie'><br></td>
                <!-- 产品简介(默认值) -->
              </tr>
            </table></td>
        </tr>
      </table>
    </div>
    </head>
    <body> <img id='aaa' src='pic/aaa.gif' width="30" height="80" onmouseover='mouseover(this)' onmouseout='mouseout(this)' style='cursor:hand'> 
    <img id='bbb' src='pic/bbb.gif' width="30" height="80" onmouseover='mouseover(this)'  onmouseout='mouseout(this)' style='cursor:hand'
    </body>
    </html>