ToolTip 通过Js实现代替超链接中的title效果

自定义Tooltip特效

body ul
{
list-style: none;
}
body li
{
margin: 60px;
}
div
{
border: 1px solid #CCC;
padding: 10px;
background: #dff5ff;
margin-left: 30px;
}



function initEvent() {
var links = document.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
var link = links[i];
link.onmouseover = linkOnMouseOver;
link.onmouseout = linkOnMouseOut;
}
}
function linkOnMouseOver() {
var newdiv = document.createElement("div");
newdiv.className = "Tooltip";
newdiv.style.position = "absolute";
newdiv.style.top = window.event.clientY;
newdiv.style.left = window.event.clientX;
newdiv.innerHTML = "我是自定义的Tooltip，用来代替超链接中的title";
document.body.appendChild(newdiv);
}
function linkOnMouseOut() {
var divs = document.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++) {
var newdiv = divs[i];
if (newdiv.className == "Tooltip") {
document.body.removeChild(newdiv);
}
}
}




百度
腾讯
新浪
搜狐




[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]