Script link lampeggianti
a cura della WEBURL Soc. Coop. - Cuneo/Piemonte/Italia
servizio on line dal 2001
info@weburl.it

http://www.dominioweb.org

Registrazione domini internet compresi di spazio web illimitato + utility a 19,17 euro all'anno www.dominioweb.org

 

Per fare lampeggiare i vostri link, copiate questo codice e inseritelo prima del tag </body>:

(in blu il codice da copiare):

<script language="JavaScript" type="text/javascript">

<!--  prelevato su http://web-link.it

// CREDITS:

// Rollover animation for textlinks and buttons

// by Urs Dudli and Peter Gehrig

// Copyright (c) 2001 Peter Gehrig and Urs Dudli. All rights reserved.

// Permission given to use the script provided that this notice remains as is.

// Additional scripts can be found at http://www.24fun.com

// info@24fun.com

// 11/27/2001

 

// IMPORTANT:

// If you add this script to a script-library or a script-archive

// you must insert a highly visible and clickable link to http://www.24fun.com

// right into the webpage where the script will be displayed.

 

// Do not edit the code below

var maxborder_thickness

var border_thickness

var i_fadestrength

var i_fadestrengthstep

var linkpostop

var linkposbottom

var linkposleft

var linkposright

var linewidth

var lineheight

var animatedlink

var animatedcolor

var interval=50

var plusorminus=1

 

function 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>")

}        

//  End -->

</script>

 

 

Oltre al colore è anche possibile variare la dimensione del rettangolo lampeggiante, inserendo a fine pagina prima della chiusura del tag </body> il seguente codice:

(in blu il codice da copiare): <a href="http://www.web-link.it/" target="_blank" onMouseOver="showlines(this,'red',4)" onMouseOut="hidelines()">http://www.web-link.it</a>