腳本11:鼠標旁邊的提示信息,類似與163登錄后的頁面提示效果




<a href="#" title="這是提示">tip</a>  
<script Language="JavaScript">  
//***********默認設置定義.*********************  
tPopWait=50;//停留tWait豪秒后顯示提示。  
tPopShow=5000;//顯示tShow豪秒后關閉提示  
showPopStep=20;  
popOpacity=99;  
//***************內部變量定義*****************  
sPop=null;  
curShow=null;  
tFadeOut=null;  
tFadeIn=null;  
tFadeWaiting=null;  
document.write("<style type='text/css'id='defaultPopStyle'>");  
document.write(".cPopText {  background-color: #F8F8F5;color:#000000; border: 1px #000000 solid;font-color: font-size: 12px; padding-right: 4px; padding-left: 4px; height: 20px; padding-top: 2px; padding-bottom: 2px; filter: Alpha(Opacity=0)}");  
document.write("</style>");  
document.write("<div id='dypopLayer' style='position:absolute;z-index:1000;' class='cPopText'></div>");  
function showPopupText(){  
var o=event.srcElement;  
MouseX=event.x;  
MouseY=event.y;  
if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};  
        if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""};  
if(o.dypop!=sPop) {  
sPop=o.dypop;  
clearTimeout(curShow);  
clearTimeout(tFadeOut);  
clearTimeout(tFadeIn);  
clearTimeout(tFadeWaiting);  
if(sPop==null || sPop=="") {  
dypopLayer.innerHTML="";  
dypopLayer.style.filter="Alpha()";  
dypopLayer.filters.Alpha.opacity=0;  
}  
else {  
if(o.dyclass!=null) popStyle=o.dyclass   
else popStyle="cPopText";  
curShow=setTimeout("showIt()",tPopWait);  
}  
}  
}  
function showIt(){  
dypopLayer.className=popStyle;  
dypopLayer.innerHTML=sPop;  
popWidth=dypopLayer.clientWidth;  
popHeight=dypopLayer.clientHeight;  
if(MouseX+12+popWidth>document.body.clientWidth) popLeftAdjust=-popWidth-24  
else popLeftAdjust=0;  
if(MouseY+12+popHeight>document.body.clientHeight) popTopAdjust=-popHeight-24  
else popTopAdjust=0;  
dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;  
dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;  
dypopLayer.style.filter="Alpha(Opacity=0)";  
fadeOut();  
}  
function fadeOut(){  
if(dypopLayer.filters.Alpha.opacity<popOpacity) {  
dypopLayer.filters.Alpha.opacity+=showPopStep;  
tFadeOut=setTimeout("fadeOut()",1);  
}  
else {  
dypopLayer.filters.Alpha.opacity=popOpacity;  
tFadeWaiting=setTimeout("fadeIn()",tPopShow);  
}  
}  
function fadeIn(){  
if(dypopLayer.filters.Alpha.opacity>0) {  
dypopLayer.filters.Alpha.opacity-=1;  
tFadeIn=setTimeout("fadeIn()",1);  
}  
}  
document.onmouseover=showPopupText;  
</script>


腳本12：如果文字過長,則將過長的部分變成省略號顯示



<DIV STYLE="width: 120px; height: 50px; border: 1px solid blue;  
            overflow: hidden; text-overflow:ellipsis">  
<NOBR>就是比如有一行文字，很長，表格內一行顯示不下.</NOBR>  
</DIV>

腳本13：滾動的圖片



<script language="javascript"> 
imgArr=new Array() 
imgArr[0]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://mc.mapabc.com/mapcard/images/LP_card_1.gif border=0></a>" 
imgArr[1]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://mc.mapabc.com/mapcard/images/LP_card_1.gif border=0></a>" 
imgArr[2]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://mc.mapabc.com/mapcard/images/LP_card_1.gif border=0></a>" 
imgArr[3]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://mc.mapabc.com/mapcard/images/LP_card_1.gif border=0></a>" 
imgArr[4]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=http://mc.mapabc.com/mapcard/images/LP_card_1.gif border=0></a>" 
var moveStep=4        //步長，單位：pixel 
var moveRelax=100    //移動時間間隔，單位：ms 
ns4=(document.layers)?true:false 
var displayImgAmount=4    //視區(qū)窗口可顯示個數(shù) 
var divWidth=220    //每塊圖片占位寬 
var divHeight=145    //每塊圖片占位高 
var startDnum=0 
var nextDnum=startDnum+displayImgAmount 
var timeID 
var outHover=false 
var startDivClipLeft 
var nextDivClipRight 
function initDivPlace(){ 
    if (ns4){ 
        for (i=0;i<displayImgAmount;i++){ 
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*i) 
        } 
        for (i=displayImgAmount;i<imgArr.length;i++){ 
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*displayImgAmount) 
        } 
    }else{ 
        for (i=0;i<displayImgAmount;i++){ 
            eval("document.all.divAds"+i+".style.left="+divWidth*i) 
        } 
        for (i=displayImgAmount;i<imgArr.length;i++){ 
            eval("document.all.divAds"+i+".style.left="+divWidth*displayImgAmount) 
        } 
    } 
} 
function mvStart(){ 
    timeID=setTimeout(moveLeftDiv,moveRelax) 
} 
function mvStop(){ 
    clearTimeout(timeID) 
} 
function moveLeftDiv(){ 
    if (ns4){ 
        for (i=0;i<=displayImgAmount;i++){ 
            eval("document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left=document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left-moveStep") 
        } 
        startDivClipLeft=parseInt(eval("document.divOuter.document.divAds"+startDnum+".clip.left")) 
        nextDivClipRight=parseInt(eval("document.divOuter.document.divAds"+nextDnum+".clip.right")) 
        if (startDivClipLeft+moveStep>divWidth){ 
            eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+divWidth) 

            eval("document.divOuter.document.divAds"+startDnum+".left="+divWidth*displayImgAmount) 
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".left=document.divOuter.document.divAds"+nextDnum+".left+"+divWidth) 
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".clip.left=0") 

             
            startDnum=(++startDnum)%imgArr.length 
            nextDnum=(startDnum+displayImgAmount)%imgArr.length 

            startDivClipLeft=moveStep-(divWidth-startDivClipLeft) 
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight) 
        }else{ 
            eval("document.divOuter.document.divAds"+nextDnum+".clip.left=0") 
            startDivClipLeft+=moveStep 
            nextDivClipRight+=moveStep 
        } 
        eval("document.divOuter.document.divAds"+startDnum+".clip.left="+startDivClipLeft) 
        eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+nextDivClipRight) 
    }else{ 
        for (i=0;i<=displayImgAmount;i++){ 
            eval("document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.left=document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.pixelLeft-moveStep") 
        } 

        startDivClipLeft=parseInt(eval("document.all.divAds"+startDnum+".currentStyle.clipLeft")) 
        nextDivClipRight=parseInt(eval("document.all.divAds"+nextDnum+".currentStyle.clipRight")) 

        if (startDivClipLeft+moveStep>divWidth){ 
            eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+divWidth+","+divHeight+",0"+")'") 

            eval("document.all.divAds"+startDnum+".style.left="+divWidth*displayImgAmount) 
            eval("document.all.divAds"+parseInt((nextDnum+1)%imgArr.length)+".style.left=document.all.divAds"+nextDnum+".style.pixelLeft+"+divWidth) 

            startDnum=(++startDnum)%imgArr.length 
            nextDnum=(startDnum+displayImgAmount)%imgArr.length 

            startDivClipLeft=moveStep-(divWidth-startDivClipLeft) 
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight) 
        }else{ 
            startDivClipLeft+=moveStep 
            nextDivClipRight+=moveStep 
        } 
        eval("document.all.divAds"+startDnum+".style.clip='rect(0,"+divWidth+","+divHeight+","+startDivClipLeft+")'") 
        eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+nextDivClipRight+","+divHeight+",0)'") 
    } 
    if (outHover){ 
        mvStop() 
    }else{ 
        mvStart() 
    } 

     
} 
function writeDivs(){ 
    if (ns4){ 
        document.write("<ilayer name=divOuter width=750 height="+divHeight+">") 

        for (i=0;i<imgArr.length;i++){ 
            document.write("<layer name=divAds"+i+">") 
            document.write(imgArr[i]+" ") 
            document.write("</layer>") 
        } 
        document.write("</ilayer>") 
        document.close() 
        for (i=displayImgAmount;i<imgArr.length;i++){ 
            eval("document.divOuter.document.divAds"+i+".clip.right=0") 
        } 
    }else{ 
        document.write("<div id=divOuter style='position:relative' width=750 height="+divHeight+">") 

        for (i=0;i<imgArr.length;i++){ 
            document.write("<div id=divAds"+i+" style='position:absolute;clip:rect(0,"+divWidth+","+divHeight+",0)'>") 
            document.write(imgArr[i]+" ") 
            document.write("</div>") 
        } 
        document.write("</div>") 
        for (i=displayImgAmount;i<imgArr.length;i++){ 
            eval("document.all.divAds"+i+".style.clip='rect(0,0,"+divHeight+",0)'") 
        } 
    } 
} 
</script> 
<BODY onload=javascript:mvStart()> 
<SCRIPT language=javascript>writeDivs();initDivPlace();</SCRIPT> 

最新評論