 |
 |
 |
 |
 |
 |
 |
 |
|
|
|
|
|
|
|
|
Sur cette page, je vais essayer de regrouper quelques scripts en Javascript (langage qui peut être interpreté par la plupart des navigateurs web dont bien sûr Netscape et Internet Explorer, et le nouveau Opéra.
2. ONLOAD, ONMOUSEOVER ET ONMOUSEOUT
3. IMAGES ALTERNATIVES SUR UN LIEN
6. AFFICHER 2 PAGES EN UN SEUL CLIC
7. AFFICHER UNE FENÊTRE "POP-UP"
FICHIERS JAVASCRIPT
Javascript Maker : jvasmakr.zip (Taille : 223 Ko)
Smart Script 4.0 : smartsct.zip (Taille : 367 Ko)
Documentation Netscape sur Javascript : js-official-doc.zip (Taille : 95 Ko)
Exemples Javascript (34 Scripts): jsample.zip (Taille : 26 Ko)
LIENS
La Petite Boutique Java & JavaScript
JavaScript-Intro by Voodoo-Qaghan
Un script javascript est défini par les 2 balise <SCRIPT> et </SCRIPT> (cf : GUIDE HTML). L'argument LANGUAGE="Javascript" est inséré dans le balise de début pour indiquer que le langage du script est du Javascript. En effet, il existe d'autres langages de script, comme le VBScript, mais qui n'est interpreté que par IE de Microsoft. Il peut être placé à n'importe quel endroit de la page, mais il est généralement situé entre les balises <HEAD> et </HEAD>.
Un script est un ensemble de fonctions qui sont définies entre les balises de script et qui peuvent être appelées à n'importe quel moment.
Une fonction débute toujours pas "nom_fonction () {" et termine par "}".
Il ne faut pas oublier les points virgule à la fin de chaque ligne Javascript. En effet, ce langage permet d'écrire toute sa fonction en une seule ligne, sans aucun retour à la ligne mais pour lui indiquer une nouvelle ligne, il faut mettre un point virgule.
2. ONLOAD, ONMOUSEOVER ET ONMOUSEOUT
Lorsque la page est chargée, elle peut effectuer une action par l'intermediaire de l'argument ONLOAD="quoi_faire" placé dans la balise <BODY>.
Lorsque le curseur de la souris passe au dessus d'un lien, elle active une fonction que l'on appelle OnMouseOver et lorsqu'elle quitte le lien, elle appelle OnMouseOver.
Dans la balise de début d'un lien (cf : GUIDE HTML), il faut rajouter l'argument OnMouseOver="quoi_faire" pour indiquer ce qui doit être fait lorsque le curseur de la souris passe au dessus du lien. Même utilisation avec OnMouseOut
Beaucoup de fonction Javascript utilisent cet argument qui est donc très important dans la programmation en JS.
3. IMAGES ALTERNATIVES SUR UN LIEN
Pour mettre un effet de style, il est toujours agréable de voir lorsqu'on est au dessus d'une image, qu'elle s'anime lorsque le curseur passe au dessus. Ca rends la page plus animée, interactive.
La fonction est définie en 2 temps : d'abord la définition des différentes images qui seront affichées par la suite puis la fonction proprement dite.
Script :
Dans la première partie, il faut définir les images, en prenant bien soin de ne pas se tromper dans la taille des images, sous peine d'avoir des surprise :-).
Dans la deuxième partie, dans l'argument ONMOUSEOVER, on change l'image source de la zone d'image et on la remplace par l' image définie dans la première partie. On rétabli ensuite l'image initiale dans l'argument ONMOUSEOUT, car on a défini la même image dans l'image2 et dans la zone d'image du début.
4. MESSAGE DANS LA BARRE D'ETAT
Un lien est souvent un mot, ou un groupe de mots très bref. Pour cela, une description est parfois nécessaire. Pour cela, vous pouvez faire qu'un message apparaisse dans la barre d'état, à la place de la page de destination (en bas de la fenêtre de votre navigateur web).
Cette fonction utilise encore l'argument ONMOUSEOVER, mais pas ONMOUSEOUT, car il n'est pas nécessaire de remettre un texte vide dans la barre d'état car le navigateur le fait automatiquement.
Vous devez donc mettre, comme argument dans la balise de début d'un link, ONMOUSEOVER="window.status='bonjour'". Si vous souhaitez mettre des ' , des <, des > ou des " dans votre texte, il faut utiliser les codes des caractères spéciaux (cf : GUIDE HTML).
Lorsque vous souhaitez changer votre site de place, ou tout simplement une page, il est interressant de faire une page qui renvoiera l'internaute directement vers la bonne page, vers votre site. Pour cela, il existe des fonctions qui permettent de renvoyer automatiquement vers une autre page au bout de quelques secondes.
Voici donc le script de la page de redirection :
Dans cet exemple, une fonction est définie, et elle va remplacer le texte de la barre de location (avec l'adresse internet) par num1.htm, ce qui est la même chose que ce qui s'effectue lorsqu'on clique sur un lien. La fonction est ensuite appelée 2 secondes (2 000 milisecondes) après le chargement de la page.
Comme certains navigateurs ne comprennent pas le Javascript (eh oui, il y en a ...), ja vous conseille de mettre quand même un lien vers votre page, au cas où le script ne marcherait pas.
6. AFFICHER 2 PAGE EN UN SEUL CLIC
Si vous avez plusieurs frames dans vos page, il serait utilse de pouvoir changer le contenu de 2, voir plus, pages en même temps, en appuyant sur UN SEUL lien, ce qui n'est pas possible avec les liens classiques.
Il faut en fait utiliser la même méthodes que précédemment, c'est à dire créer une fonction qui sera chargée de changer 2 pages et de l'appeler lors du clic sur le lien.
La fonction showTwo() comporte 2 parties, chacune chargeant une page dans une frame. Le nom de chacune des 2 frames est frame1 et frame2. Il faut veiller à mettre EXACTEMENT les même noms que dans la page où sont définies les frames. On appele ensuite la fonction dans un lien, en n'omettant pas de dire que le lien point sur un script en javascript, et nom le nom d'une page.
7. AFFICHER UNE FENETRE "POP-UP"
C'est très simple mais peut être très interressant de pouvoir ouvrir une petite fenêtre pour mettre son menu, par exemple. Il faut définir une fonction que l'on appelle dans le lien.
Voici le script :
Voici donc le code. Il n'est pas nécessaire de mettre tous les arguments quant aux caractéristiques de la fenêtre, en sachant que pas défaut, la fenêtre ouverte aura les mêmes caractéristiques que la fenêtre classique de votre navigateur.
Pour éviter qu'un internaute indiscrêt lise vos pages confidentielles, vous pouvez mettre un mot de passe pour en inetrdire l'accès aux intrus. Dans cet exemple, mettre un mot de passe revient à faire un lien vers une page ayant comme nom le mot de passe + ".html". Ce n'est pas le meilleur moyen, mais comme il n'est pas facile de le "cracker", peu de personnes le tenteront. (les hackers préfèrent les sites du FBI et de la NASA, c'est plus compliqué donc plus interressant...)
Script :
En fait, si le mot de passe n'est pas le bon, l'intrus aura une page d'erreur du type "ERREUR 404 : PAGE NON TROUVEE". Il n'aura le message "Mot de Passe Invalide" que s'il n'entre rien dans la case mot de passe.