begin process at 2012 02 12 01:37:29
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Effets

 > ANNONCE LETTRE PAR LETTRE

ANNONCE LETTRE PAR LETTRE


 Information sur la source

Note :
8,33 / 10 - par 3 personnes
8,33 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Effets Niveau :Initié Date de création :30/05/2004 Vu :5 808
Auteur : francktfr

Ecrire un message privé
Site perso
Commentaire sur cette source (2)
Ajouter un commentaire et/ou une note

 Description

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

Source

  • <!-- 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>
<!-- 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>



 Sources du même auteur

Source avec une capture CHOIX DE DATES ET DE PERIODE
HORLOGE DIGITALE , SI SI
Source avec une capture TEXT COLORISÉ AVEC LE POURCENTAGE
Source avec une capture MENU AVEC EFFET DE DÉGRADÉ
ECLATEZ LE TEXTE
Toutes les sources de francktfr

 Sources de la même categorie

Source avec Zip Source avec une capture SHOWMAPAREA par phidelum
DHTML IE FILTRE DÉGRADÉ (OUTIL HTML POUR DÉVELOPPEUR) par internetdev
Source avec Zip ANIMATION DU TEXTE par brennal
Source avec Zip Source avec une capture EFFET RAYONS DU SOLEIL par tefa24600
TAILLE DE TEXTE EN FONCTION DE LA RÉSOLUTION par tefa24600
Toutes les sources de la catégorie Effets

Commentaires et avis

Commentaire de o_moi le 16/05/2007 13:22:10

bonjour,
merci pour ce code
j'arrive tb mais pouvez-vous me dire comment arreter  "lettre par lettre" à la fin d'une phrase ou plutot comment
ex:
ecrire 3-4 phrases et arreter sur la 1ère?
je pense que c'est dans "timeout" mais je ne sais pas comment le modifier.
merci pour votre aide

Commentaire de ffert le 06/01/2008 21:20:03 5/10

désolé, mais apparement cela ne fonctionne pas sous FireFox.

n'étant pas spécialiste de javascript, je ne sais pas pourquoi.
(pourtant ça avait l'air sympa.... :p)

une mise à jour était elle prévue ? :D

cordialement.

 Ajouter un commentaire

Nos sponsors


Sondage...

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

Photo Green Energy Solutions With Light Bulb Morphed Into LandscapePhoto Renewable Energy is Within Reach
Photo Framed Landscape Image of Monument Valley 

Visiter la photothèque
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 3,494 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)