Membre de ClickFR, Reseau francophone Paie-Par-Click
Accueil
Accueil
- [ CSS : ] [ DHTML : ] [ HTML : ] [ JavaScript : ] [ Refs : ]
Accueil

JavaScript 1.3
Barre d'état

  Texte 'Pingpong'

fonction de ce script  principe de ce script  le script lui-meme  demonstration du script  telechargement du script

  Fonction
Le but de ce script est de placer en permanence un texte dans la barre d'état de la page. Ce texte se déplacera de gauche à droite et de droite à gauche.
  Principe
Une instruction simple permet d'accéder à la barre d'état du navigateur : window.status.
Pour afficher un texte dès le chargement de la page, il suffit d'utiliser une fonction qui place un texte dans la barre d'état et de lancer cette fonction au chargement de la page.
Pour le faire voyager, quelques instructions simples suffisent.
  1. Quelques variables :
    • une pour le texte en lui-même,
    • deux pour créer des espaces à gauche et à droite du message (doivent être égales),
    • une pour le message et ses 'marges',
    • une pour déterminer la direction de déplacement de départ,
    • une dernière pour la vitesse de déplacement.
  2. Une fonction :
    • d'abord elle déplace le texte vers la gauche,
    • puis vers la droite.
  Le script
dans la partie <head>
<script language="JavaScript">
// message = devinez... mais attention au premier et au dernier caractère qui doivent être identiques et uniques dans le message
var message = "* Un coup a gauche, un coup a droite *";

// marge1 = L'espace réservé au départ à gauche du message
var marge1 = " ";

// marge2 = L'espace réservé au départ à droite du message
var marge2 = " ";

// message1 = Le message complet que l'on va ensuite triturer
var message1 = marge1+message+marge2;

// dir = La direction de départ (doit rester en anglais)
var dir = "left";

// speed = la vitesse de déplacement (petite : rapide; grande : lent)
var speed = 50;

function pingpong() {
if (dir == "left") {
message2 = message1.substring(2,message1.length) + " ";
window.status = message2;
setTimeout("pingpong();",speed);
message1 = message2;

// Le caractère entre guillemets à la fin de la ligne est celui qui 'délimite' votre message
if (message1.substring(0,1) == "*") {
dir = "right";
}
}
else {
message2 = " " + message1.substring(0,message1.length-2);
window.status = message2;
setTimeout("pingpong();",speed);
message1 = message2;
if (message1.substring(message1.length-1,message1.length) == "*") {
dir = "left";
}
}
}
</script>

dans la partie <body>
<body onload="pingpong();">

Contenu de la page...

</body>
  Démonstration

Voir la démonstration
  Téléchargement
Ce script est disponible en deux versions :
  • le script est intégré à la page où il agit,
  • le script est dans un fichier séparé de la page où il agit (fichier.js et fichier.html).

    L'intérêt d'un script dans un fichier séparé est de pouvoir le partager entre plusieurs pages html.
    Cela permet aussi de le rendre inaccessible à toute personne qui souhaiterai l'enregistrer pour une autre utilisation.
    		•
    Script intégré :
    status_pingpong.zip
    1 Ko    		 telechargez le script telechargez le script
    Script séparé :
    status_pingpong2.zip
    1 Ko
    Recherche
    		aide sur la recherche
    CSS 2
    DHTML
    HTML 4
    Références
    Aide générale
    hit-parade
    Votez TOP Ouaibe !

    statistiques
    aide sur les contacts aide sur la mailing-list aide sur la newsletter