Astuces du SpeeDEricH.com

Merci pour ce ....... SPEED EXEMPLE JAVA SCRIPT 18

UNE MACHINE A ÉCRIRE

Pas de DHTML sans Internet Explorer V4 ou Netscape V4

Un texte machine à écrire si ton navigateur supporte le DHTML.

1- Recopie le script suivant dans la partie HEAD de ton document :
<SCRIPT LANGUAGE="Javascript">
<!-- Script machine a ecrire Partie 1
// Tu peux utiliser ou modifier ce script librement
twTexte = '<FONT COLOR=white>ton texte ici,</FONT><BR>ton texte encore ici.<BR><BR><FONT
COLOR=white>ton texte toujours ici,</FONT><BR>N\'oublie pas de placer un lien vers le SpeeDEricH.com sur ton propre site. Pour plus d\'informations, clique sur le lien <A HREF=http://www.speederich.com><FONT COLOR=red><I>SPEEDSITE</I></FONT></A> ...<BR>';
twWait = 0;

NS4 = IE4 = VERSION4 = 0;

// Construction du saut de ligne (pour AOL Press)
twSautLigne = "&";
twSautLigne = twSautLigne.charAt(0)+"nbsp;"+"<BR>";

function twInit () {
if (VERSION4) {
        if (NS4) {
            twObj1 = document.twN1;
            twObj2 = twObj1.document.twN2;
        }
        if (IE4) {
            twObj1 = document.all.twN1;
            twObj2 = document.all.twN2;
        }
        twChangeString ();
        twSynchro = twWait;
        twTimer = setInterval("twScroll()",50);
    }
}
// -->
</SCRIPT>
<SCRIPT LANGUAGE="Javascript1.2">
<!-- Script machine a ecrire Partie 2
NS4 = (document.layers) ? 1 : 0;
IE4 = (document.all) ? 1 : 0;
VERSION4 = (NS4|IE4) ? 1 : 0;

// Recharger la page en cas de redimensionnement (NS4 uniquement)
if(NS4){oW=innerWidth;oH=innerHeight;onresize=function(){if(innerWidth!=oW||innerHeight!=oH)location.reload()}}

function twChangeString () {
    twWrite ("<DIV ID=\"twN3\"><P CLASS=twP>"+twTexte+twSautLigne+twTexte+"</DIV><DIV ID=\"twN4\"></DIV>");
    if (NS4) {
        twObj2.visibility = "show";
        twObj3 = twObj2.document.twN3;
        twObj4 = twObj2.document.twN4;
        twHeight = (Math.round(twObj3.document.height/16)*16)/2;
    }
    if (IE4) {
        twObj2.style.visibility = "visible";
        twObj3 = document.all.twN3;
        twObj4 = document.all.twN4;
        twHeight = twObj3.offsetHeight / 2 ;
    }
}

function twWrite (str) {
    if (NS4) {
        with (twObj2.document) {
            write(str);
            close();
        }
    }
    if (IE4) twObj2.innerHTML = str;
}

function twScroll () {
if (++twSynchro < 60) {
        if (NS4) twObj4.left = twSynchro*5;
        if (IE4) twObj4.style.left = twSynchro*5;
    }
    else {
    if (twSynchro == 60) {
            if (NS4) {
                twObj4.top += 16;
                twObj4.left = 0;
            }
            if (IE4) {
                twObj4.style.top = twObj4.style.pixelTop + 16 ;
                twObj4.style.left = 0;
            }
        }
        else {
        if (twSynchro < 69) {
                if (NS4) {
                    twObj3.top-=2;
                    twObj4.top-=2;
                }
                if (IE4) {
                    twObj3.style.top = twObj3.style.pixelTop - 2;
                    twObj4.style.top = twObj4.style.pixelTop - 2;
                }
            }
            else {
                twSynchro = 0;
                if (NS4) {
                    if ( -twHeight >= twObj3.top) {
                        twObj4.top = 48 ;
                        twObj3.top = 0 ;
                    }
                }
                if (IE4) {
                    if ( -twHeight >= twObj3.style.pixelTop) {
                        twObj4.style.top = 48 ;
                        twObj3.style.top = 0 ;
                    }
                }
            }
        }
    }
}
// -->
</SCRIPT>
<STYLE TYPE='text/css'>
<!--
#twN1 {
    position: relative;
    z-index: 100;
    width: 304px;
    height: 68px;
    padding: 2;
    clip:rect (0px,304px,68px,0px);
}
#twN2 {
    position:absolute;
    z-index: 200;
    width: 300px;
    height: 64px;
    visibility: hidden;

    clip:rect (0px,300px,64px,0px);
}
#twN3 {
    position:absolute;
    z-index: 300;
    width: 300px;
    height: 64px;
}
#twN4 {
    position:absolute;
    z-index: 400;
    width: 300px;
    height: 64px;
    top: 48px;
    left: 0px;

    background-color: #000066;
    layer-background-color: #000066;

    border: 1px solid #000066;
}
P.twP {
    text-align: left;
    text-decoration: none;

    color: #92a4e0;
    font-family: Arial,Helvetica;
    font-style: Normal;
    font-weight: Bold;
    font-size: 12px;
    line-height: 16px;
}
}
-->
</STYLE>

2- Adapte le a ton application en modifiant la variable :
twTexte
= "<FONT COLOR=white>ton texte";
Si tu utilises le signe ' (apostrophe) place un backslash (\) devant. Tu peux utiliser sans problème les tags HTML : <FONT>,<BR>,<A> pour mettre ton texte en forme.
3- Recopie enfin le code HTML suivant dans la partie BODY de ton document :
<!-- Affichage des infos style machine a ecrire -->
<TABLE CELLSPACING="0" CELLPADDING="0" BORDER=0 WIDTH="304" HEIGHT="68" BGCOLOR="#000066">
<TR VALIGN="Top">
<TD><DIV ID="twN1">
    <DIV ID="twN2">
    <P ALIGN="Center">
    <FONT FACE="Arial,Helvetica" SIZE="2" COLOR="#92a4e0">Pas de DHTML sans
    <I><B>Internet Explorer V4</B></I> ou <I><B>Netscape V4</B></I></FONT>
    </DIV>
</DIV>
</TD>
</TR>
</TABLE>
<P>
<SCRIPT LANGUAGE="Javascript1.2">
<!-- Script machine a ecrire Partie 3
if (window.onload) {
if (window.RegExp) {
var regstr = '^[^\\{]*\\{((.|\\t|\\n|\\r)*)}[^\\}]*$';
window.onload.toString().match(regstr);
window.onload = new Function (RegExp.$1+"; twInit ();");
}
}
else window.onload = twInit;
// --> </SCRIPT>

RETOUR à l'exemple précédent  : Bulles d'aide dynamiques SOMMAIRE des Exemples JAVA SCRIPT SUITE des exemples : Une image qui suit ..

ED   05-03-2003
SpeeDEricH.com Nedstat Tu mesures ton audience ?