»
AnglaisFran�aisVietnamien

Imprimer - Rollover animation pour textlinks - JavaScriptBank.com

Version compl�te: jsB@nk » Lien » Rollover animation pour textlinks
URL: https://www.javascriptbank.com/rollover-animation-for-textlinks.html

Rollover animation pour textlinks © JavaScriptBank.comCet JavaScript crée un rollover animation pour textlinks et boutons (photos). Le bon zoom-in-zoom-out effet requiert presque pas de bande passante. Vous mai de chaque série JavaScript lien d'une couleur différente et une autre borderwidth. Un chargement rapide. True copier et coller l'installation. Très facile de configuration. Dégrade bien avec les navigateurs non IE5x.

Version compl�te: jsB@nk » Lien » Rollover animation pour textlinks
URL: https://www.javascriptbank.com/rollover-animation-for-textlinks.html



JavaScript
<SCRIPT>// Do not edit the code belowvar maxborder_thicknessvar border_thicknessvar i_fadestrengthvar i_fadestrengthstepvar linkpostopvar linkposbottomvar linkposleftvar linkposrightvar linewidthvar lineheightvar animatedlinkvar animatedcolorvar interval=50var plusorminus=1function showlines(animatedlink,animatedbordercolor,maxwidth) {    if (document.all) {        thislink=animatedlink        thisbordercolor=animatedbordercolor        maxborder_thickness=maxwidth        border_thickness=1        i_fadestrength=100;        i_fadestrengthstep=Math.floor(100/maxborder_thickness)        animation=true        doanimation()    }}function doanimation() {    if (animation) {        if (border_thickness>=maxborder_thickness || border_thickness<1) {            plusorminus*=-1        }        border_thickness+=plusorminus        i_fadestrength=100-(i_fadestrengthstep*border_thickness)        border_color=thisbordercolor        linkpostop=thislink.offsetTop        linkposbottom=linkpostop+thislink.offsetHeight        linkposleft=thislink.offsetLeft        linkposright=linkposleft+thislink.offsetWidth            linewidth=linkposright-linkposleft+(4*border_thickness)         lineheight=linkposbottom-linkpostop+(4*border_thickness)            document.all.linetopimg.style.posTop=linkpostop-(2*border_thickness)        document.all.linetopimg.style.posLeft=linkposleft-(2*border_thickness)            document.all.linebottomimg.style.posTop=linkpostop+lineheight-(2*border_thickness)        document.all.linebottomimg.style.posLeft=linkposleft-(2*border_thickness)            document.all.lineleftimg.style.posTop=linkpostop-(1*border_thickness)        document.all.lineleftimg.style.posLeft=linkposleft-(2*border_thickness)            document.all.linerightimg.style.posTop=linkpostop-(1*border_thickness)        document.all.linerightimg.style.posLeft=linkposleft+linewidth-(3*border_thickness)            var linetopimgcontent="<table border=0 cellpadding=0 cellspacing=0><tr><td bgcolor="+border_color+">"        linetopimgcontent+="<img src='emptyimg.gif' width="+linewidth+" height="+border_thickness+">"        linetopimgcontent+="</td></tr></table>"        var linebottomimgcontent=linetopimgcontent        var lineh=lineheight-border_thickness        var lineleftimgcontent="<table border=0 cellpadding=0 cellspacing=0><tr><td bgcolor="+border_color+">"        lineleftimgcontent+="<img src='emptyimg.gif' width="+border_thickness+" height="+lineh+">"        lineleftimgcontent+="</td></tr></table>"        var linerightimgcontent=lineleftimgcontent                linetopimg.filters.alpha.opacity=i_fadestrength        linebottomimg.filters.alpha.opacity=i_fadestrength        lineleftimg.filters.alpha.opacity=i_fadestrength        linerightimg.filters.alpha.opacity=i_fadestrength            linetopimg.innerHTML=linetopimgcontent        linebottomimg.innerHTML=linebottomimgcontent        lineleftimg.innerHTML=lineleftimgcontent        linerightimg.innerHTML=linerightimgcontent            document.all.linetopimg.style.visibility="visible"        document.all.linebottomimg.style.visibility="visible"        document.all.lineleftimg.style.visibility="visible"        document.all.linerightimg.style.visibility="visible"                var timer=setTimeout("doanimation()",interval)    }    else {        clearTimeout(timer)    }}function hidelines() {    if (document.all) {        animation=false        document.all.linetopimg.style.visibility="hidden"        document.all.linebottomimg.style.visibility="hidden"        document.all.lineleftimg.style.visibility="hidden"        document.all.linerightimg.style.visibility="hidden"    }}if (document.all) {    document.write("<a span id='linetopimg' style='position:absolute;top:0px;left:0px;filter:alpha(opacity=100)'> </span>")    document.write("<a span id='linebottomimg' style='position:absolute;top:0px;left:0px;filter:alpha(opacity=100)'> </span>")    document.write("<a span id='lineleftimg' style='position:absolute;top:0px;left:0px;filter:alpha(opacity=100)'> </span>")    document.write("<a span id='linerightimg' style='position:absolute;top:0px;left:0px;filter:alpha(opacity=100)'> </span>")}</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<a href="http://www.javascriptbank.com" onMouseOver="showlines(this,'red',16)" onMouseOut="hidelines()">Mouse over this to see</a><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->