现在我想实现这样的功能:加入在页面上有一张图片A,还有一张隐藏的图片B,当我把鼠标移动到A上的时候图片B就能显示,畏怯紧跟在鼠标后(随着鼠标移动),当鼠标移出A时,图片B隐藏。
现在我到时能出现这样的效果,但是当鼠标移动到图片A上的时候B总是一闪一闪的(要求只能用JavaScript实现)
我的思路是当鼠标进入A时,现获取鼠标的坐标,然后再把这个坐标值赋给图片B的左上角坐标谢谢各位了!

解决方案 »

  1.   

    function popUp() {
    //当前值
    newX = window.event.x + document.body.scrollLeft
    newY = ((window.event.y)*(-1) + document.body.scrollTop)*(-1)
    //B图片
    imageB = document.all.imageB
      if ( imageB .style.display == ""){
        imageB .style.display = "none" 
      }
      else {
         imageB .style.display = ""
      }
       //适当调整 
        imageB .style.pixelLeft = newX+10
        imageB .style.pixelTop = newY-23
    }
      

  2.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script>
    function popUp() {
    //当前值
    newX = window.event.x + document.body.scrollLeft
    newY = ((window.event.y)*(-1) + document.body.scrollTop)*(-1)
    //B图片
    var imageB = document.getElementById("imageB");
      if ( imageB .style.display == ""){
        imageB .style.display = "none"
      }
      else {
        imageB .style.display = ""
      }
      //适当调整
        imageB .style.pixelLeft = newX
        imageB .style.pixelTop = newY
    }
    </script>
    </head><body>
    <img src="main_files/0921_172X140_1.jpg" alt="" onmousemove="popUp()" onmouseout="javascript:document.getElementById('imageB').style.display='none'"/>
    <p>
    </p>
    <img id="imageB" src="main_files/10001260870892181.jpg" alt="" style="display:none; position:absolute"/>
    </body>
    </html>
    加了你的代码后是这个样子的
      

  3.   

    imageB .style.display = "none"
    这句去掉试试
      

  4.   

    把imageB .style.display = "none"改为imageB .style.display = ""就可以了