js为超级连接加上说明文字

// ===================================================
// Tooltip V1.01
// 为超级连接加上说明文字
// Author:Huacn Lee
// Blog: Huacn.cnblogs.com
// ===================================================
var _BarIdName = "___tooltipbar";
var _BarTitleIdName = "___tooltipbartitle";
var _BarLinkIdName = "___tooltipbarlink";

//页面上调用的方法
function initToolTip()
{  
 //创建tooltip显示区域
 initTipbar();
 //注册CSS样式
 //initStyle();
 
 var tagaArry = new Array(); 
 var tag = null;  
 tagaArry = document.getElementsByTagName("a");
 
 for(var i=0;i<tagaArry.length;i++)
 { 
  tag = tagaArry[i]; 
  //alert(tag.href);  
  //var oldTitle = tag.title; 
  
  if(tag.id=='ssHyperLink')
   continue;
  
  //为超级连接加入鼠标事件
  //进入连接
  tag.onmouseover = function()
  {
   showTipbar(this);
  };
  //离开连接
  tag.onmouseout = function()
  {
   hideTipbar(this); 
  }
  //在连接上移动,设置坐标
  tag.onmousemove = function()
  {   
   setTipLocation();
  }
  
  //为Firefox加入mousemove的事件侦听,因为window.eventFirefox没有办法用
  if(tag.addEventListener)
  {
    tag.addEventListener('mousemove', setTipLocation, true);
  }
 } 
}

//显示tooltip
function showTipbar(tag)

 var tipbar = $(_BarIdName);
 var tipTitle = $(_BarTitleIdName);
// var tipLink = $(_BarLinkIdName); 
 
 tipTitle.innerHTML = tag.title;
// tipLink.innerHTML =tag.href;
 tag.title = ""; 
 tipbar.style.display = ""; 
}

//隐藏tooltip
function hideTipbar(tag)
{
 var tipbar = $(_BarIdName);
 var tipTitle = $(_BarTitleIdName);
 
 tipbar.style.display = "none"; 
 tag.title = tipTitle.innerHTML; 
}

//设置tipbar的位置
function setTipLocation(e)
{
 var intX=0,intY=0; 
 //判断有没有收到firefox的监听的event
 if(e == null)
 {
  //当没收到时用window.event IE与Opera支持的
  e = window.event;  
 }
 
 if(e.pageX || e.pageY)
 {
     intX=e.pageX; intY=e.pageY;
    }
   
 else if(e.clientX || e.clientY)
 {
     if(document.documentElement.scrollTop)
  {
         intX=e.clientX+document.documentElement.scrollLeft;
         intY=e.clientY+document.documentElement.scrollTop;
        }
     else
  {
         intX=e.clientX+document.body.scrollLeft;
         intY=e.clientY+document.body.scrollTop;
        }
    }
 
 //取得tooltip对象
 var tipbar = $(_BarIdName); 
  
 tipbar.style.top = (intY+20)+"px";
 tipbar.style.left = (intX +10)+"px";
}

//初始化tooltip区域
function initTipbar()
{   
 var div = document.createElement("div"); 
 div.className = "tooltipclass123123";
 div.id = _BarIdName;
 
 var divTitle = document.createElement("p");
 divTitle.id = _BarTitleIdName; 
 divTitle.className = "tip";
 div.appendChild(divTitle);

 
// var divLink = document.createElement("p");
// divLink.id = _BarLinkIdName;
// divLink.className = "url";
// div.appendChild(divLink);
 
 document.body.appendChild(div);
 div.style.display = "none";
 
 //alert(div.innerHTML);
}

//注册css
function initStyle()
{  
 var linkstyle = document.createElement("link");
 linkstyle.setAttribute("href","../Style/Skin1/equipment.css");
 linkstyle.setAttribute("rel","stylesheet");
 linkstyle.setAttribute("type","text/css");  
 linkstyle.setAttribute("media","screen"); 
 
 document.getElementsByTagName("head")[0].appendChild(linkstyle);
}

function $(re)
{
 return document.getElementById(re);
}
 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值