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


答案：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<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=> 
<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\" />"; 
        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> 
</head> 
<body> 
<h1>用JavaScript给站外链接的cursor进行改造</h1> 
<p>因为是自己用的，没把图片路径写成变量存起来，链接测试：实验室首页，google。</p> 
    <p>Copyright © 2006 aoao , Some Rights Reserved .</p> 
    <!--统计代码开始 --> 
<script src="http://www.google-易做图ytics.com/urchin.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
    _uacct = "UA-600690-2"; 
    urchinTracker(); 
    </script> 
        <!--统计代码结束 --> 
</body> 
</html> 


  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
上一个：硬盘浏览程序，保存成网页格式便可使用
下一个：常用js脚本
更多图片编程知识: