Annonce lettre par lettre

Contenu du snippet

Pas encore optimisé, mais un effet original :o)

Source / Exemple :


<!-- code créé par francktfr pour http://www.javascript.codefr.com -->
<HTML>
<HEAD>
<STYLE>
.Letter {HEIGHT: 200; TEXT-ALIGN: left; VERTICAL-ALIGN: top;}
</STYLE>
</HEAD>
<BODY onload="Retrec('test',200,0,ph1)">

<DIV STYLE="z-index: 3; border: 1 inset; position: absolute; top: 50; left: 50; height: 5; width: 400; background: #99CC99"></DIV>

<DIV ID="test" STYLE="padding-left: 5; padding-top: 0; z-index: 5; text-align: left; position: absolute; top: 52; left: 50; height: 30; width: 800; font: bold 14 Arial; color: #336699"></DIV>

<SCRIPT>
var ph1 = escape("Un style d'annonce\npas comme les autres\n... amusez-vous bien ...")
function Retrec(TextContainerID, iMaxSize, iSentence, Texto){
    var Cont = document.getElementById(TextContainerID)
    var aTexts = Texto.split("%0A")
    var Text = unescape(aTexts[iSentence])
    var start = Cont.innerText.length
    if (start == Text.length){
        iSentence < aTexts.length-1 ? iSentence++ : iSentence=0
        setTimeout("EraseText('"+TextContainerID+"', "+iMaxSize+", "+iSentence+",'"+Texto+"')",500)
        return(1)
    }
    var L = Text.substring(start,start+1)
    var ShowText = Text.substring(0, start).replace(" ", "&nbsp;")
    if (L == " "){L="&nbsp;"} 
    Cont.innerHTML = "<SPAN CLASS=Letter>"+ ShowText +"</SPAN><SPAN ID=\""+TextContainerID+"LastLetter\" CLASS=Letter STYLE=\"filter: alpha(Opacity=50); font-size: "+iMaxSize+"\">"+L+"</SPAN>"
    if (L != "&nbsp;"){
            ChangeSize("LastLetter", iMaxSize, TextContainerID, iMaxSize, iSentence, Texto)}
        else
            {Retrec(TextContainerID, iMaxSize, iSentence, Texto)}
}
function EraseText(TextContainerID, iMaxSize, iSentence, Texto){
    var Cont = document.getElementById(TextContainerID)
    if (Cont.innerText != "")
    {
        Cont.innerText = Cont.innerText.substring(0,Cont.innerText.length-1)
        setTimeout("EraseText('"+TextContainerID+"', "+iMaxSize+", "+iSentence+",'"+Texto+"')",10)
    }
    else
    {Retrec(TextContainerID, iMaxSize, iSentence, Texto)}
}
function ChangeSize(SpanId, CurrentSize, TextContainerID, iMaxSize, iSentence, Texto){
    var InitSize = document.getElementById(TextContainerID).style.fontSize.replace("px","")*1
    if (CurrentSize > InitSize){
        var step = 20
        CurrentSize = CurrentSize-step >= InitSize ? CurrentSize-step : InitSize 
        document.getElementById(TextContainerID+SpanId).style.fontSize = CurrentSize + "px"
        setTimeout("ChangeSize('"+SpanId+"',"+CurrentSize+",'"+TextContainerID+"', "+iMaxSize+", "+iSentence+",'"+Texto+"')",0)
    }
    else
    {Retrec(TextContainerID, iMaxSize, iSentence, Texto)}
}
</SCRIPT>

</BODY>
</HTML>

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.