<style>
.f{
cursor:pointer;
position:absolute;
width:357px;
height:194px;
padding:15px 0 0 50px;
background-image:(../images/div.gif);
}
</style>
<script>
var oo = true
var vv=["1","2","3","4"]
function create(obj,num){
if(oo==true){
oo=false
var div =document.createElement("div")
var z = "<table width='200' border='0'><tr><td>1</td><td>2;</td><td>3</td></tr><tr><td>4</td><td>5</td><td>6</td></tr></table>"
//var z = "<div><table width="200" border="0"><tr><td>1</td><td>2;</td><td>3</td></tr><tr><td>4</td>
//<td>5</td><td>6</td></tr></table></div>"
div.className="f"
div.id="div"
div.innerHTML=vv[num]
div.innerHTML = z
document.body.appendChild(div)
var left=obj.offsetLeft
var top=obj.offsetTop
var width=obj.offsetWidth
while (obj=obj.offsetParent) {
left += obj.offsetLeft;
top += obj.offsetTop;
};
document.getElementById("div").style.left=left+width
document.getElementById("div").style.top=top
div.onmouseout=del
}}function del(e){
e=e||event;
var obj=e.relatedTarget||e.toElement;
var div =document.getElementById("div")
if(div.contains(obj))return;
document.body.removeChild(div)
oo=true
}
</script>
<span id="text" onmouseover="create(this,1)" onMouseOut="del()"  style="cursor:pointer;" >1232</span>

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-loose.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gbk" /> 
    <title></title> 
    <style>
    .f{
    cursor:pointer;
    position:absolute;
    width:357px;
    height:194px;
    padding:15px 0 0 50px;
    background-image:(../images/div.gif);
    }
    </style>
    <script>
    var oo = true
    var vv=["1","2","3","4"]
    function create(obj,num){
    if(oo==true){
    oo=false
    var div =document.createElement("div")
    var z = "<div><table width='200' border='0'><tr><td>1</td><td>2</td><td>3</td></tr><tr><td>4</td><td>5</td><td>6</td></tr></table></div>";
    div.className="f"
    div.id="div"
    div.innerHTML=z;
    document.body.appendChild(div)
    var left=obj.offsetLeft
    var top=obj.offsetTop
    var width=obj.offsetWidth
    while (obj=obj.offsetParent) {
    left += obj.offsetLeft;
    top += obj.offsetTop;
    };
    document.getElementById("div").style.left=left+width
    document.getElementById("div").style.top=top
    div.onmouseout=del
    }}function del(e){
    e=e||event;
    var obj=e.relatedTarget||e.toElement;
    var div =document.getElementById("div")
    if(div.contains(obj))return;
    document.body.removeChild(div)
    oo=true
    }
    </script>
    </head>
    <body>
    <span id="text" onmouseover="create(this,1)" onMouseOut="del()"  style="cursor:pointer;" >1232</span>
    </body> 
    </html>
      

  2.   

    谢谢s_liangchao1s 大大
    发帖以后自己有仔细的想看一下···居然想明白了···
    不过还是得谢谢大大~!修改后:
    <style type="text/css">
    .f{
    cursor:pointer;
    position:absolute;
    width:357px;
    height:194px;
    padding:15px 0 0 50px;
    background-image:url(../Img/div.gif);
    }
    </style>
    <script>
    var oo = true
    function create(obj){
    if(oo==true){
    oo=false
    var div =document.createElement("div")
    var z = "<div><table><tr><td>1</td><td>2</td><td>3</td></tr><tr><td>4</td><td>5</td><td>6</td></tr></table></div>"
    div.className="f"
    div.id="div"
    div.innerHTML=z
    document.body.appendChild(div)
    var left=obj.offsetLeft
    var top=obj.offsetTop
    var width=obj.offsetWidth
    while (obj=obj.offsetParent) {
    left += obj.offsetLeft;
    top += obj.offsetTop;
    };
    document.getElementById("div").style.left=left+width
    document.getElementById("div").style.top=top
    div.onmouseout=del
    }}function del(e){
    e=e||event;
    var obj=e.relatedTarget||e.toElement;
    var div =document.getElementById("div")
    if(div.contains(obj))return;
    document.body.removeChild(div)
    oo=true
    }
    </script>
    <span id="text" onmouseover="create(this)" onMouseOut="del()"  style="cursor:pointer;" >1232</span>