200分200分求一简单问题.

当鼠标放到"切换"上出现一层,鼠标移走时消失,下面是我的代码,我这个不能给"网易加连接",还有就是不是弹出一层,还有就是还没等到鼠标放到层上就消失了.你可在我基础上改,也可以给我一个代码.
function toggle(el){
if(typeof(el)=="string"){el=document.getElementById(el);}
if(el.style.display!=""){el.style.display="";return}
if(el.style.display!="none"){el.style.display="none";return}
el.style.left = event.x-5;
el.style.top = event.y-10;
el.style.visibility = 'visible';
}document.writeln("    <td id=\"s_td_1\" width=\"117\" class=\"f-12-000\" onmouseover=toggle('n1');>切换<\/td>");
document.writeln("  <\/tr>");
document.writeln("<\/table>")
document.writeln("<div id=\"n1\" style=\"display:none;text-align:right;\">网易&nbsp;新浪<\/div>")

解决方案 »

  1.   

    http://www.cnblogs.com/ustbwuyi/archive/2006/07/17/452700.aspx
      

  2.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <SCRIPT language=JavaScript>
    //***********默认设置定义.*********************
    tPopWait=50;//停留tWait豪秒后显示提示。
    tPopShow=5000;//显示tShow豪秒后关闭提示
    showPopStep=20;
    popOpacity=99;//***************内部变量定义*****************
    sPop=null;
    curShow=null;
    tFadeOut=null;
    tFadeIn=null;
    tFadeWaiting=null;document.write("<style type='text/css'id='defaultPopStyle'>");
    document.write(".cPopText {  background-color: #F8F8F5;color:#000000; border: 1px #000000 solid;font-color: font-size: 12px; padding-right: 4px; padding-left: 4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter: Alpha(Opacity=0)}");
    document.write("</style>");
    document.write("<div id='dypopLayer' style='position:absolute;z-index:1000;' class='cPopText'></div>");
    function showPopupText(){
    var o=event.srcElement;
     MouseX=event.x;
     MouseY=event.y;
     if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};
            if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""};
     if(o.dypop!=sPop) {
       sPop=o.dypop;
       clearTimeout(curShow);
       clearTimeout(tFadeOut);
       clearTimeout(tFadeIn);
       clearTimeout(tFadeWaiting);
       if(sPop==null || sPop=="") {
        dypopLayer.innerHTML="";
        dypopLayer.style.filter="Alpha()";
        dypopLayer.filters.Alpha.opacity=0;
        }
       else {
        if(o.dyclass!=null) popStyle=o.dyclass
         else popStyle="cPopText";
        curShow=setTimeout("showIt()",tPopWait);
       } }
    }function showIt(){
      dypopLayer.className=popStyle;
      dypopLayer.innerHTML=sPop;
      popWidth=dypopLayer.clientWidth;
      popHeight=dypopLayer.clientHeight;
      if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24
       else popLeftAdjust=0;
      if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24
       else popTopAdjust=0;
      dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;
      dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;
      dypopLayer.style.filter="Alpha(Opacity=0)";
      fadeOut();
    }function fadeOut(){
     if(dypopLayer.filters.Alpha.opacity<popOpacity) {
      dypopLayer.filters.Alpha.opacity+=showPopStep;
      tFadeOut=setTimeout("fadeOut()",1);
      }
      else {
       dypopLayer.filters.Alpha.opacity=popOpacity;
       tFadeWaiting=setTimeout("fadeIn()",tPopShow);
       }
    }function fadeIn(){
     if(dypopLayer.filters.Alpha.opacity>0) {
      dypopLayer.filters.Alpha.opacity-=1;
      tFadeIn=setTimeout("fadeIn()",1);
      }
    }
    document.onmouseover=showPopupText;
    </SCRIPT>
    </HEAD><BODY>
    <A HREF="#" title="呱呱<br>sdfsdf<img src='http://www.microsoft.com/china/msdn/Archives/library/images/orgchart.gif'>">蛙蛙王子</A> 
    </BODY>
    </HTML>
      

  3.   

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>
        <script type="text/jscript">
    function show(e) {
    if(typeof(e) == "string") {
    e = document.getElementById(e);
    }
    e.style.position = 'absolute';
    e.style.left = event.x - 5;
    e.style.right = event.y - 10;
    e.style.display = 'block';
    }
    function hide(e) {
    if(typeof(e) == "string") {
    e = document.getElementById(e);
    }
    e.style.display = 'none';
    }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
    <table>
    <tr>
    <td onmouseover="show('win')" onmouseleave="hide('win')" width="80" bgcolor="lime">切换</td>
    </tr>
    </table>
    <div id="win" style="display:none; width:100px; height:100px; background-color:Beige">wjs</div>
        </form>
    </body>
    </html>
      

  4.   

    同意sunjay117(我是一只鸡)，我用过这个，完全可以啊！
      

  5.   

    我就小改了一下:
    放入head中:
     <script language ="javascript" type="text/javascript" >
        function toggle(el){
    if(typeof(el)=="string"){el=document.getElementById(el);}
    if(el.style.display!=""){el.style.display="";return}
    if(el.style.display!="none"){el.style.display="none";return}
    el.style.left = event.x-5;
    el.style.top = event.y-10;
    el.style.visibility = 'visible';
    }document.writeln(" <table border='1'><tr>   <td id=\"s_td_1\" width=\"117\" class=\"f-12-000\" onmouseover=toggle('n1');>切换<\/td>");
    document.writeln("  <\/tr>");
    document.writeln("<\/table>")
    document.writeln("<div id=\"n1\" style=\"display:none;text-align:right;\"><a href ='http://www.sina.com'>网易&nbsp;新浪</a><\/div>")    </script>
      

  6.   

    我发现avisnet(第十维度)的更好用，记录！学习！
      

  7.   

    to:当鼠标放到"切换"上出现一层,鼠标移走时消失
    当你的鼠标放到"切换"上会出现一层,可以移走时消失了,那你怎么点击你的"网易&新浪"连接.?
      

  8.   

    单击连接时,你还要把新浪,网易分开,就要再加一个<a></a>这样就可以了呀...呵呵...
      

  9.   

    to:我发现avisnet(第十维度)的更好用，记录！学习！那个方法是不错:可以你永远点不开连接啊???
    因为当你的鼠标移开时,就消失了呀....
      

  10.   

    想要点开连接,,我感觉要把onmouseleave函数去掉才可以的...
      

  11.   

    同意sunjay117(我是一只鸡)，我用过这个，完全可以啊！
      

  12.   

    改了一下,不过你要自己设定停留时间才行function toggle(el){
    if(typeof(el)=="string"){el=document.getElementById(el);}
    if(el.style.display!=""){el.style.display="";return}
    if(el.style.display!="none"){el.style.display="none";return}
    el.style.left = event.x-5;
    el.style.top = event.y-10;
    el.style.visibility = 'visible';
    }document.writeln("  <table>  <td id=\"s_td_1\" width=\"117\" class=\"f-12-000\" onmouseover=toggle('n1');>切换<\/td>");
    document.writeln("  <\/tr>");
    document.writeln("<\/table>")
    document.writeln("<div id=\"n1\" style=\"display:none;text-align:right;\"><a href=\"http://www.163.com\">网易</a>&nbsp;<a href=\"http:www.sina.com\">新浪</a><\/div>")
      

  13.   

    sPop=null;
    curShow=null;
    tFadeOut=null;
    tFadeIn=null;
    tFadeWaiting=null;document.write("<style type='text/css'id='defaultPopStyle'>");
    document.write(".cPopText {  background-color: #F8F8F5;color:#000000; border: 1px #000000 solid;font-color: font-size: 12px; padding-right: 4px; padding-left: 4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter: Alpha(Opacity=0)}");
    document.write("</style>");
    document.write("<div id='dypopLayer' style='position:absolute;z-index:1000;' class='cPopText'></div>");
    function showPopupText(){
    var o=event.srcElement;
     MouseX=event.x;
     MouseY=event.y;
     if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};
            if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""};
     if(o.dypop!=sPop) {
       sPop=o.dypop;
       clearTimeout(curShow);
       clearTimeout(tFadeOut);
       clearTimeout(tFadeIn);
       clearTimeout(tFadeWaiting);
       if(sPop==null || sPop=="") {
        dypopLayer.innerHTML="";
        dypopLayer.style.filter="Alpha()";
        dypopLayer.filters.Alpha.opacity=0;
        }
       else {
        if(o.dyclass!=null) popStyle=o.dyclass
         else popStyle="cPopText";
        curShow=setTimeout("showIt()",tPopWait);
       } }
    }function showIt(){
      dypopLayer.className=popStyle;
      dypopLayer.innerHTML=sPop;
      popWidth=dypopLayer.clientWidth;
      popHeight=dypopLayer.clientHeight;
      if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24
       else popLeftAdjust=0;
      if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24
       else popTopAdjust=0;
      dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;
      dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;
      dypopLayer.style.filter="Alpha(Opacity=0)";
      fadeOut();
    }function fadeOut(){
     if(dypopLayer.filters.Alpha.opacity<popOpacity) {
      dypopLayer.filters.Alpha.opacity+=showPopStep;
      tFadeOut=setTimeout("fadeOut()",1);
      }
      else {
       dypopLayer.filters.Alpha.opacity=popOpacity;
       tFadeWaiting=setTimeout("fadeIn()",tPopShow);
       }
    }function fadeIn(){
     if(dypopLayer.filters.Alpha.opacity>0) {
      dypopLayer.filters.Alpha.opacity-=1;
      tFadeIn=setTimeout("fadeIn()",1);
      }
    }
    document.onmouseover=showPopupText;
    </SCRIPT>
    </HEAD>
      

  14.   

    下面这个点击层上的按钮后关闭<html xmlns="http://www.w3.org/1999/xhtml" >
    <head id="Head1" runat="server">
        <title>Untitled Page</title>
        <script type="text/jscript">
    function show(e) {
    if(typeof(e) == "string") {
    e = document.getElementById(e);
    }
    e.style.position = 'absolute';
    e.style.left = event.x - 5;
    e.style.right = event.y - 10;
    e.style.display = 'block';
    }
    function hide(e) {
    if(typeof(e) == "string") {
    e = document.getElementById(e);
    }
    e.style.display = 'none';
    }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
    <table>
    <tr>
    <td onmouseover="show('win')" width="80" bgcolor="lime">切换</td>
    </tr>
    </table>
    <div id="win" style="display:none; width:100px; height:100px; background-color:Beige">
    <div style="position:absolute; width:16px; height:16px; left:80px; top:4px; cursor:hand" onclick="hide('win')">x</div>
    </div>
        </form>
    </body>
    </html>
      

  15.   

    这个是CSDN“结帖”功能代码，鼠标指向时，显示可给分数和已给分数，鼠标移开时，层关闭，楼主可参考：<!--ASPX页面先定义一个隐藏的层-->
    <body>
    <div id="scoreLayer" style="DISPLAY: none; FONT-SIZE: 13px; Z-INDEX: 99; BACKGROUND: #ffff00; WIDTH: 120px; POSITION: absolute"></div>
    ......
    //鼠标指向时
    function myOnMouseOver(e)
    {
    //其它略，只写了显示层的部分代码......
    //获取层
    var cen = document.getElementById("scoreLayer");
    //设置层背景色
    cen.style.background = "#FFFF00";
    //设置层中内容
    cen.innerText = "该问题总分值："+ zong +"\r\n现可给的分值："+ n; //层显示
    var eTop = e.offsetTop;
    var eLeft= e.offsetLeft;
    var h = e.clientHeight;
    var w = e.clientWidth;
    while (e = e.offsetParent)
    {
    eTop += e.offsetTop;
    eLeft += e.offsetLeft;
    }
    cen.style.display = "";
    cen.style.top = eTop + h;
    cen.style.left= eLeft + w - cen.clientWidth;
    }//鼠标离开时
    function myOnMouseOut()
    {
    document.getElementById("scoreLayer").style.display = "none";
    }