• 2008-11-16

    带注释的表格菜单

    Tag:

    版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本声明
    http://www.blogbus.com/dickmoore-logs/53711818.html


    一:将下面的代码放在<HEAD>与</HEAD>之间
    <SCRIPT language=javascript >
    document.write(
    "<div id=\\"tooltip\\" style=\\"position:absolute;visibility:hidden; padding:3px;border:1px solid #528AC6;\\
    ;background-color:#ffdfd0; height: 19px; left: 77px; top: 96px\\"></div>");
    function showtip(text)  //显示链接的说明
    {
      if (document.all&&document.readyState=="complete")  //针对IE
      {

      document.all.tooltip.innerHTML="<div vAlign=center><font SIZE=2>"+text+"</font></div>";
      document.all.tooltip.style.pixelLeft=event.clientX+document.body.scrollLeft+10;
      document.all.tooltip.style.pixelTop=event.clientY+document.body.scrollTop+10;
       document.all.tooltip.style.visibility="visible";
      }
    }
    function hidetip()  
    {
    if (document.all)
      document.all.tooltip.style.visibility="hidden";
    }
    function setcolor(fntcolor,bgcolor)
    {
      document.all.tooltip.style.bgcolor=bgcolor;
      document.all.tooltip.innerHTML.Color = fntcolor;
    }
    function showhint(text)
    {
          onmousemove=showtip(text);
          onmouseover=showtip(text);
          onmouseout=hidetip();
    }
    </SCRIPT>


    二:将下面的代码复制到〈BODY〉区
    <table align=center border=1 bordercolordark=#ffffff bordercolorlight=#a8cbf1 
    cellspacing=0 class=t width="300" bordercolor="#6699CC" cellpadding="0">
                  <tbody> 
                  <tr align="center" bgcolor="#ffdfd0"> 
                    <td height=9 width="25%" class="css3"><a        href="../../sbtx.html"        onMouseMove="showtip('赏心悦目<br>精美的图像和壁纸能使你得到一些放松!')" onMouseOut=hidetip() 
          target=_blank>赏心悦目</a></td>
                    <td height=9 width="25%" class="css3"><a        href="../../flashmenu1.htm"        onMouseMove="showtip('网页素材<br>大量的网页素材给你的网页制作提供方便!')" 
          onMouseOut=hidetip()>网页素材</a></td>
                    <td height=9 width="25%" class="css3"><a        href="../../wyjcs.html"        onMouseMove="showtip('图像处理<br>图形软件的使用以及图像的特效制作')" onMouseOut=hidetip() 
          target=_blank>图像处理</a></td>
                    <td height=9 width="25%" class="css3"><a        href="../../soft.htm"        onMouseMove="showtip('网页特效<br>网页特效的大宝库,有详细的使用说明')" onMouseOut=hidetip() 
          target=_blank>网页特效</a></td>
                  </tr>
                  </tbody> 
                </table>
    分享到: