用 JavaScript 给站外链接的 cursor 进行改造_javascript技巧

<title>用 JavaScript 给站外链接的 cursor 进行改造 - Beautiful Style « 样式之美 » loaoao.com </title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="KEYWords" content="js,cursor,outlinks,links,jscc,css,xhtml,effect"> <meta name="DEscription" content="用 JavaScript 给站外链接的 cursor 进行改造"> <meta name="author" content="aoao"> <meta content="all" name="robots"> <link rel="start" href="http://www.loaoao.com" title="Home"> <script type="text/javascript"> /* * Author:aoao * Homepage:http://www.loaoao.com * Email:loaoao@gmail.com / QQ:2222342 * Copyright (c) 2006 aoao * Licensed under a Creative Commons Attribution 2.5 License (http://creativecommons.org/licenses/by/2.5/) */ var jscc = new Object(); jscc = { init:function(){/*_*/}, path:"/scripts/jscc/", include:function (file){ var j=document.createElement("script"); j.setAttribute('type','text/javascript'); j.setAttribute('src',jscc.path+file+'.js'); document.getElementsByTagName("head")[0].appendChild(j); } }; jscc.addEvent = function( obj, type, fn ) { if ( obj.attachEvent ) { obj['e'+type+fn] = fn; obj[type+fn] = function(){obj['e'+type+fn]( window.event );} obj.attachEvent( 'on'+type, obj[type+fn] ); } else { obj.addEventListener( type, fn, false ); } }; jscc.getPosition=function(e) { e = e || window.event; var cursor = {x:0, y:0}; if (e.pageX || e.pageY) { cursor.x = e.pageX; cursor.y = e.pageY; } else { cursor.x = e.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft; cursor.y = e.clientY + (document.documentElement.scrollTop ||document.body.scrollTop) - document.documentElement.clientTop; } return cursor; }; jscc.widgets = {/**/}; jscc.widgets.outLinks={ init:function(){ var outSiteIcon = document.createElement("div"); outSiteIcon.setAttribute('id','outSiteIcon'); document.getElementsByTagName("body").item(0).appendChild(outSiteIcon); outSiteIcon.innerHTML="<img src=\"outlink.gif\" / alt="用 JavaScript 给站外链接的 cursor 进行改造_javascript技巧" >"; var as = document.getElementsByTagName("a"); aslen = as.length; var url="http://lab.loaoao.com"; for(var i=0;i< aslen ;i++){ if (as[i].href.indexOf(url)&&as[i].href!=""){ //jscc.addEvent(as[i],"mouseover",jscc.widgets.outLinks.show); jscc.addEvent(as[i],"mousemove",jscc.widgets.outLinks.show); jscc.addEvent(as[i],"mouseout",jscc.widgets.outLinks.hide); //as[i].target = "_blank"; } } }, show:function(e){ if(e!=undefined){ var outSiteIcon = document.getElementById("outSiteIcon"); outSiteIcon.style.display="block"; cursorCoordinate = new jscc.getPosition(e); outSiteIcon.style.top=cursorCoordinate.y - 4 + "px"; outSiteIcon.style.left=cursorCoordinate.x + 5 + "px"; } }, hide:function(){ var outSiteIcon = document.getElementById("outSiteIcon"); outSiteIcon.style.display = "none"; } } window.onload = function(){ jscc.widgets.outLinks.init(); } </script> <style type="text/css"> #outSiteIcon{ position:absolute; z-index:99; display:none; } </style> <h1>用JavaScript给站外链接的cursor进行改造</h1> <p>因为是自己用的，没把图片路径写成变量存起来，链接测试：<a href="/">实验室首页</a>，<a href="http://www.google.com">google</a>。</p> <p>Copyright © 2006 <a href="http://www.loaoao.com/">aoao</a> , <a href="http://www.creativecommons.cn/licenses/by-nc/2.5/">Some Rights Reserved</a> .</p> <!--统计代码开始 --> <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script> <script type="text/javascript"> _uacct = "UA-600690-2"; urchinTracker(); </script> <!--统计代码结束 -->
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]