de l'onglet Javascript...Cet assistant de WebExpert 5 vous permet d'afficher plusieurs images, qui défilent automatiquement l'une après l'autre.
Pour lancer l'assistant, cliquez sur le bouton
de l'onglet Javascript...
Le script de détection (inséré dans l'en-tête du document en dessous du premier script) a déjà été expliqué en détail pour le javascript (Images alternatives sur lien), nous ne le ferons donc plus ici.
Le script principal doit réaliser un changement d'images (comme dans le javascript "Sélection d'images") mais ici, ce n'est plus le choix dans un élément <SELECT> qui va déterminer le changement de l'URL de l'image (SRC) mais bien le script lui-même, avec un délai déterminé au moyen d'un timer.
De plus, dans ce javascript, est ajouté un lien pour chaque image, puisque ce sont des publicités et que l'on doit pouvoir se rendre sur les pages ou les sites concernés par cette image.
On va en premier lieu devoir créer un constructeur de tableau, pour pouvoir créer les deux tableaux, l'un qui va contenir les différentes images et l'autre, les différentes URL de destination.
Pour un rappel sur la notion de tableau, voir Notions Générales.
Ce constructeur, procédure CreerArray() initialise un tableau dont les éléments (à partir de 1) vont contenir les URL données en argument, dans l'élément <BODY> (CreerArray.arguments.length).
Lors du chargement de la page, l'événement onLoad de l'élément <BODY> va effectuer une instruction conditionnelle qui vérifie d'abord si le navigateur utilisé est compatible (sinon, ignore le code), dans l'affirmative, va créer par (pubs = new CreerArray) un tableau qui comprend les URL des images de la publicité. Vous comprenez ici l'intérêt de prendre les arguments du constructeur CreerArray, pour construire le tableau, car de cette manière, le même constructeur pourra être employé pour construire les deux tableaux nécessaires au script (pubs ici et liens pour les URL des documents à afficher).
Ensuite, la procédure AfficherPub() va être lancée avec en argument le tableau pubs et le délai du timer (en msec), attribué par défaut à 10 sec [AfficherPub(pubs,10000)].
Les images s'affichent maintenant, l'une après l'autre, puisque la valeur de l'URL de l'image (SRC) prend successivement les valeurs du tableau (pubs) par le code : document.pubImg.src = pubs[++pub], suivant le délai du timer [pubT = setTimeout("AfficherPub(pubs,pubDelai)", pubDelai1)].
L'astuce ici est l'incrémentation préfixée de pub (++pub) qui permet par location=liens[pub] (propriété définie location de JS qui concerne l'adresse URL du document) de charger la page HTML désirée. En effet, la variable incrémentée de cette façon (préfixée) permet que les index des tableaux soient en concordance, c'est-à-dire que l'élément du tableau pubs soit accordé avec l'élément du tableau liens : autrement dit, à chaque image correspond son lien (tel qu'encodé dans l'assistant bien sûr).
Dès que la valeur de pub dépasse le nombre d'éléments du tableau des images (pubs), la condition (if) remet la variable pub à zéro et la fonction recommence l'affichage à partir du début (première image).
Pour une parfaite compatibilité avec Netscape, le script crée donc le code HTML de la première image choisie, avec ses dimensions [largeur (WIDTH) et hauteur (HEIGHT)]. En effet, Netscape affichera les autres images dans les dimensions de la première, ce qui implique de nouveau ici (comme dans le javascript "Sélection 'images"), un choix d'images équivalentes (les bannières ou drapeau étant les plus appropriées aux publicité). Car en fait, seul le nom de l'élément IMG (image) est important pour le script, qui va lui-même déterminer les liens et les images, pour et dans cet élément.
Il est donc important, pour laisser le script attribuer les liens correspondant aux images, de "désactiver" l'URL indiqué dans le code HTML : c'est le rôle du code "return false" de l'événement onClick de l'élément <A> qui contient le code HTML de l'élément IMG.
Pour rappel, en voici le code complet créé par l'assistant :
Dans ce code, on peut dire que HREF est inutile, puisque désactivé par "return false" et que les adresses sont fournies par la fonction AfficherPub(), mais comme il ne gêne pas, il peut rester présent.
Pour terminer, comme vous devez y être habitué maintenant, l'identificateur (pubT) permet l'annulation du compte à rebours [initialisé par setTimeout()] par la méthode clearTimeout() (qui annule l'évaluation de l'expression) placée dans l'élément <BODY>, attribut "onUnload", c'est-à-dire, lorsque l'on quitte la page (bonne précaution de programmeur).
Si vous désirez ajouter et/ou enlever des images et adresses, vous pouvez le faire en ajoutant et/ou supprimant des noms de fichiers graphiques (élément <BODY> pour les images) et des fichiers HTML (élément <A>). Il faut bien veiller cependant à ne pas mélanger les correspondances, par inversion de l'ordre des éléments (images et fichiers).
Il vous est possible également de changer la vitesse de délai d'affichage, en diminuant ou augmentant la valeur du délai attribué par défaut (10000 msec) : également dans l'élément <BODY> [AfficherPub(pubs,2000)]
