给100分，向大伙请教两个问题

1.
  在一些网站上看到用jsp做的一种效果，鼠标一移到某一个按钮上面会自动产生一个小窗口，显示相关信息，鼠标一移走就会自动消失。请问这个是怎么做的呢？ajax？如何实现的呢？ 2.
  根据不同状态改变其图片
               <input onclick="footsize(40,1)" type="image" id="image_40" src="client/pages/res/pic/pro_img/img_401.gif" width="31" height="31" /> <script type="text/javascript">
  function footsize(size,id)
  {      if(size==38){
        document.getElementById("select_peim").value="38";
        }
      if(size==39){document.getElementById("select_peim").value="39";}
      if(size==40){
        document.getElementById("image_40").src="client/pages/res/pic/pro_img/img_403.gif"; }

  }</script>
-----------图片改变不了，是不是哪写错了，有没有更好的办法呢？

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

1.直接JS 就可以了，在目标区域设置一个DIV 当获得鼠标事件时把div显示出来就可以了。
2.没太看懂你的代码，但是似乎可以采用和第一个问题一样的方法，设置N个隐藏的DIV每个div一幅画，调用JS时，根据传进来参数决定哪个div显示就可以了
用js也好用ajax框架实现也好，本质是onmouseover事件中创建一个div，在div中显示相关信息。
1.最简单的方法<img alt="提示信息" src="">
  <div title="提示信息">
2.用层做提示信息框

<body onclick="hidden();">
<div id="div1" style="background-color:blue;width:130px;" onmouseover="show();" onmouseout="hidden();">把鼠标移上来看看</div>
<br>
<div id="div2" style="position:absolute;z-index:10;background-color:red;width:200px;height:100;display:none;">DIV2提示信息</div>
</body>
<script>
function show(){
var event=event||window.event;
document.getElementById("div2").style.display="";
document.getElementById("div2").style.left=event.clientX+"px";
document.getElementById("div2").style.top=event.clientY+"px";
}
function hidden(){
document.getElementById("div2").style.display="none";
}
</script>
1.得到当前空间的坐标，动态创建个div，设置div同当前空间坐标一致，ok。
数据看你怎么用了，显示页面的时候就加载了，就不需要ajax了。否则用之2.
obj（img）.style.width=88;
obj（img）.style.height=88;
js就可以实现LZ的要求！
1：用onmouseover和onmouseout
2:  document.getElementById("select_peim").value="38";不知道select_peim这个是从那里来的
<html>
<head>
<META http-equiv=Content-Type content=text/html; charset=gbk>
<title>透明的信息提示框</title>
<style type="text/css">

</style>
<script Language="JavaScript">
var rT=true;//允许图像过渡
var bT=true;//允许图像淡入淡出
var endaction=false;//结束动画
var ns4 = document.layers;
var ns6 = document.getElementById && !document.all;
var ie4 = document.all;
function initToolTips()
{
  if(ns4||ns6||ie4)
  {
    if(ns4) toolTipSTYLE = document.toolTipLayer;
    else if(ns6) toolTipSTYLE = document.getElementById("toolTipLayer").style;
    else if(ie4) toolTipSTYLE = document.all.toolTipLayer.style;
    else
    {
      toolTipSTYLE.visibility = "visible";
      toolTipSTYLE.display = "none";
    }
  }
}
//菜单相关代码
//***********默认设置定义.*********************
tPopWait=500;//停留tWait豪秒后显示提示。
tPopShow=5000;//显示tShow豪秒后关闭提示
showPopStep=20;
popOpacity=100;//***************内部变量定义*****************
sPop=null;
curShow=null;
tFadeOut=null;
tFadeIn=null;
tFadeWaiting=null; var h;
var w;
var l;
var t;
var topMar = 1;
var leftMar = -2;
var space = 1;
var isvisible;
var MENU_SHADOW_COLOR='#999999';//定义菜单阴影色
var global = window.document
global.fo_currentMenu = null
global.fo_shadows = new Arrayfunction HideMenu(){
    if(isvisible==true){
      toolTipLayer.style.visibility = "hidden";
      isvisible = false;
     }
}function ShowMenu(vMnuCode,tWidth) {
        vSrc = window.event.srcElement;
        vMnuCode = "<table id='msg1' name='msg1' border='0' cellspacing='0' cellpadding='0' class='trans_msg'><td><table id='submenu' style='width:"+tWidth+"' class='bd' onmouseout='HideMenu()'><tr><td >" + vMnuCode + "</td></tr></table></td></table>";        h = vSrc.offsetHeight;
        w = vSrc.offsetWidth;
        l = vSrc.offsetLeft + leftMar+2;  //水平位置
        t = vSrc.offsetTop + topMar + h + space-3;//垂直位置
        vParent = vSrc.offsetParent;
        while (vParent.tagName.toUpperCase() != "BODY")
        {
                l += vParent.offsetLeft;
                t += vParent.offsetTop;
                vParent = vParent.offsetParent;
        }        toolTipLayer.innerHTML = vMnuCode;
        toolTipLayer.style.top = t;
        toolTipLayer.style.left = l;
        toolTipLayer.style.visibility = "visible";
        isvisible = true;
        var cssopaction=document.all("msg1").filters[0].opacity
        document.all("msg1").filters[0].opacity=0;
       if (rT) document.all("msg1").filters[1].Apply();
       if (bT) document.all("msg1").filters[2].Apply();
       document.all("msg1").filters[0].opacity=cssopaction;
       if (rT) document.all("msg1").filters[1].Play();
       if (bT) document.all("msg1").filters[2].Play();
fadeOut();
// makeRectangularDropShadow(submenu, MENU_SHADOW_COLOR, 5);
  }
function fadeOut(){
if(toolTipLayer.filters.Alpha.opacity<popOpacity) {
toolTipLayer.filters.Alpha.opacity+=showPopStep;
tFadeOut=setTimeout("fadeOut()",1);
}
else {
toolTipLayer.filters.Alpha.opacity=popOpacity;
tFadeWaiting=setTimeout("fadeIn()",tPopShow);
}
}
function fadeOut(){
if(toolTipLayer.filters.Alpha.opacity<popOpacity) {
toolTipLayer.filters.Alpha.opacity+=showPopStep;
tFadeOut=setTimeout("fadeOut()",1);
}
else {
toolTipLayer.filters.Alpha.opacity=popOpacity;
tFadeWaiting=setTimeout("fadeIn()",tPopShow);
}
}function fadeIn(){
if(toolTipLayer.filters.Alpha.opacity>0) {
toolTipLayer.filters.Alpha.opacity-=1;
tFadeIn=setTimeout("fadeIn()",1);
}
}function makeRectangularDropShadow(el, color, size)//添加阴影
{
        var i;
        for (i=size; i>0; i--)
        {
                var rect = document.createElement('div');
                var rs = rect.style
                rs.position = 'absolute';
                rs.left = (el.style.posLeft + i) + 'px';
                rs.top = (el.style.posTop + i) + 'px';
                rs.width = el.offsetWidth + 'px';
                rs.height = el.offsetHeight + 'px';
                rs.zIndex = el.style.zIndex - i;
                rs.backgroundColor = color;
                var opacity = 1 - i / (i + 1);
                rs.filter = 'alpha(opacity=' + (100 * opacity) + ')';
                el.insertAdjacentElement('afterEnd', rect);
                global.fo_shadows[global.fo_shadows.length] = rect;
        }
}
</script>
</head>
<body topmargin="0" leftmargin="0">
<div id="toolTipLayer" class="cPopText"></div>
<script>initToolTips()</script>
<center>
   <div height=21  align="center"  class="Border"  onMouseOver="ShowMenu('<font color=#ff2387>蒹  葭</font><br><br>蒹葭苍苍白露为霜。所谓伊人，在水一方。<br>溯洄从之，道阻且溯游从之，宛在水中央。<br>蒹葭凄凄，白露未晞。所谓伊人，在水之湄。<br>溯洄从之，道阻且溯游从之，宛在水中坻。<br>',220)"onMouseOut="HideMenu()">
   <div class="Divstyle">显示信息三>>> </div></div></center>
</body>
</html>
----------------------这个可以实现渐出式的提示框了。
发表于：2008-10-21 14:45:5212楼得分:0
不知道你说的窗口弹出来的数据是从数据库获取的还是直接是页面的
   ----从cookie里面获得
然后再用ajax的dwr框架异步获取数据，显示到div2中就好了。
用onmouseover和onmouseout 这个事件就可以了