自定义的类似title的提示效果

kos — Tue, 23 Feb 2010 04:06:32 +0000

前面有一篇文章实现有类似的功能

这里是用的title属性实现的这样的功能,现在用另一种方式来达到同样的效果,只不过用的是层来实现

直接看下面的例子



CODE
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script language="javascript" type="text/javascript" src="http://www.uideas.cn/download/titlestyle.js"></script> <style> body{ margin:0px; padding:0px;} #titleCov{position:absolute; z-index:6000;display:none;} #titleIframe{width:100%; position:absolute; opacity:0; _filter:Alpha(opacity=0)} #titleCon{ border:1px #00FF66 solid; background:#f2f5fa;  padding-left:4px; padding-right:4px; white-space:nowrap; _word-break:keep-all} </style> </head>  <body>  <a onMouseOver="titleView(this,'这是一个超链接')" onMouseOut="titleNone()" href="http://www.uideas.cn">友意博客</a> <a onMouseOver="titleView(this,'这是一个没有地址的图片,所以不能显示')" onMouseOut="titleNone()"></a> <a onMouseOver="titleView(this,'这是一个距左边有一段距离的图片,主要是看提示过长会有怎么的效果')" onMouseOut="titleNone()" style="padding-left:300px;"></a> <div id="titleCov">  <table border="0" cellspacing="0" cellpadding="0">   <tr>     <td id="titleCon"> </td>   </tr> </table> </div> </body> </html> 




[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

散人笔记 » 提示

自定义的类似title的提示效果