（3）自定义鼠标提示

来源：互联网发布：淘宝网针织护腰带编辑：程序博客网时间：2024/06/16 11:50
<!-- 说明：有时候单单用title属性来显示文本提示语言远远不够，我们想用粗体或者斜体电费鼠标提示，或者包含图片的鼠标提示，则可以通过创建隐藏的div标签来实现，当鼠标移动到指定目标上的时候就显示这个隐藏的div块 。此代码可灵活修改，如添加图片显示则可以在div1中加上<img/>标签等等--><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>        <title> 自定义鼠标提示，可以提示文字之外，还能提示图片等等</title>        <script type="text/javascript"> function show(oevent){ var odiv= document.getElementById("div1"); odiv.style.visibility="visible"; odiv.style.left=oevent.clientX+15; odiv.style.top=oevent.clientY+15; }  function hide(oevent){ var odiv=document.getElementById("div1"); odiv.style.visibility="hidden"; }  </script>  </head>  <body>  <div id="div2" style="background-color: red;height:20px; width:300px;" onmouseover="show(event)" onmouseout="hide(event)"></div><div id="div1" style="background-color: blue;position:absolute;visibility:hidden;padding:25px;"></div>  </body>  </html>