可以跟隨鼠標的JS鏈接提示_文本鏈接特效

鏈接提示效果，比較漂亮，提示帶有立體陰影效果，還可以跟隨鼠標移動，在使用時候，你可以將JavaScript部分另存為一個單獨的JS文件，使用時引入，在用到的時候A標簽加入示例中的函數即可，使用方法挺簡單。

<html>
<head>
<meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" />
<title>鼠標跟隨的鏈接提示</title>
<style type="text/css">
 *{font:normal 14px/150% '宋體'}
 a:link, a:visited{color:#00f; text-decoration:none}
 a:hover, a:active{color:#f00; text-decoration:underline}
</style>
<script>
function wsug(e, str){
var oThis = arguments.callee;
 if(!str) {
  oThis.sug.style.visibility = 'hidden';
  document.onmousemove = null;
  return;
 }  
 if(!oThis.sug){
  var div = document.createElement('div'), css = 'top:0; left:0; position:absolute; z-index:100; visibility:hidden';
   div.style.cssText = css;
   div.setAttribute('style',css);
  var sug = document.createElement('div'), css= 'font:normal 12px/16px "宋體"; white-space:nowrap; color:#666; padding:3px; position:absolute; left:0; top:0; z-index:10; background:#f9fdfd; border:1px solid #0aa';
   sug.style.cssText = css;
   sug.setAttribute('style',css);
  var dr = document.createElement('div'), css = 'position:absolute; top:3px; left:3px; background:#333; filter:alpha(opacity=50); opacity:0.5; z-index:9';
   dr.style.cssText = css;
   dr.setAttribute('style',css);
  var ifr = document.createElement('iframe'), css='position:absolute; left:0; top:0; z-index:8; filter:alpha(opacity=0); opacity:0';
   ifr.style.cssText = css;
   ifr.setAttribute('style',css);
  div.appendChild(ifr);
  div.appendChild(dr);
  div.appendChild(sug);
  div.sug = sug;
  document.body.appendChild(div);
  oThis.sug = div;
  oThis.dr = dr;
  oThis.ifr = ifr;
  div = dr = ifr = sug = null;
 }
 var e = e || window.event, obj = oThis.sug, dr = oThis.dr, ifr = oThis.ifr;
 obj.sug.innerHTML = str;
 
 var w = obj.sug.offsetWidth, h = obj.sug.offsetHeight, dw = document.documentElement.clientWidth||document.body.clientWidth; dh = document.documentElement.clientHeight || document.body.clientHeight;
 var st = document.documentElement.scrollTop || document.body.scrollTop, sl = document.documentElement.scrollLeft || document.body.scrollLeft;
 var left = e.clientX +sl +17 + w < dw + sl  &&  e.clientX + sl + 15 || e.clientX +sl-8 - w, top = e.clientY + st +17 + h < dh + st  &&  e.clientY + st + 17 || e.clientY + st - 5 - h;
 obj.style.left = left+ 10 + 'px';
 obj.style.top = top + 10 + 'px';
 dr.style.width = w + 'px';
 dr.style.height = h + 'px';
 ifr.style.width = w + 3 + 'px';
 ifr.style.height = h + 3 + 'px';
 obj.style.visibility = 'visible';
 document.onmousemove = function(e){
  var e = e || window.event, st = document.documentElement.scrollTop || document.body.scrollTop, sl = document.documentElement.scrollLeft || document.body.scrollLeft;
  var left = e.clientX +sl +17 + w < dw + sl  &&  e.clientX + sl + 15 || e.clientX +sl-8 - w, top = e.clientY + st +17 + h < dh + st  &&  e.clientY + st + 17 || e.clientY + st - 5 - h;
  obj.style.left = left + 'px';
  obj.style.top = top + 'px';
 }
}</script>
</head>
<body>
 <a href="/" onmouseover="wsug(event, 'www.ghpqjb.com')" onmouseout="wsug(event, 0)" target="_blank">模板無憂</a><br />
 <a href="/jscss/" onmouseover="wsug(event, '精品網頁特效')" onmouseout="wsug(event, 0)" target="_blank">網頁特效</a><br />
</body>
</html>

所屬頻道：文本鏈接特效/更新時間：2012-12-04

[收藏][報錯][返回列表]

相關文本鏈接特效：

欧美三区四区_av先锋影音资源站_亚洲第一论坛sis_影音先锋2020色资源网_亚洲精品社区_在线免费观看av网站_国产一区二区伦理_亚洲欧美视频一区二区_99视频精品全部免费在线_精精国产xxxx视频在线

可以跟隨鼠標的JS鏈接提示_文本鏈接特效

文本鏈接特效Rss訂閱特效代碼搜索

文本鏈接特效推薦

猜你也喜歡看這些