Afin d'obtenir le menu déroulant copiez le code ci dessus et
collez le a l'endroit que vous souhaitez sur la page de votre site.
Comme vous pouvez le voir ce menu est composé de deux images,
pour obtenir vos propres images modifiez les textes que j'ai mis en
rouge. Voici les explications des parties en rouge:
<!-- Début du code du menu déroulant
d'Astwinds-->
<noscript><a href="http://www.astwinds.com/">Menu
déroulant <br> d'Astwinds</A></noscript>
Ceci détermine la provenance du code html. Ne modifiez pas cette
partie du code.
<marquee>
Ceci est la balise d'ouverture du code du menu déroulant. C'est
entre cette balise et la balise de fin : </marquee> que
va se trouver le code de votre menu déroulant. Vous remarquerez
la différence de la balise d'ouverture et la balise de fermeture
par le slash "/" sur la balise
de fin.
bgcolor="#669999"
Ceci vous permet de déterminer la couleur du fond de votre menu.
Vous pouvez indiquer la couleur en code comme sur l'exemple ou bien
ecrire directement le nom de la couleur en anglais.
par exemple si vous voulez que votre fond soit rouge vous mettrez ceci:
bgcolor="red"
direction="up"
Ceci détermine la direction vers la quelle défilera votre
menu. Sur notre menu ici nous avons déterminé le défilement
vers le haut, en anglais "up"
les autres valeurs de direction sont:
direction="down"
ce qui signifie vers le bas
direction="left"
ce qui signifie vers la gauche
direction="right"
ce qui signifie vers la droite
width="150"
Ceci détermine la largeur de votre menu déroulant. La
valeur est indiquée en pixels. Plus le nombre
est grand, plus votre menu sera large, et bien sur plus le nombre sera
petit, plus votre menu sera étroit.
P ar exemple pour un menu a 200 pixels vous marquerez : width="200"
height="90"
Ceci détermine la hauteur de votre menu. Modifiez le nombre comme
pour la largeur
onmouseover="this.stop()" onmouseout="this.start()"
Ceci determine la façon dont vous arrêtez le menu de défiler.
onmouseover="this.stop()"
dès que vous passez la souris sur le menu le défilement
s'arrête
onmouseout="this.start()"
dès que vous retirez la souris votre menu redémarre
Ne modifiez rien dans ces deux options, si vous ne souhaitez pas appliquer
d'arrêt de défilement à votre menu, supprimez tout
simplement ces deux éléments de votre code
img src="../interface/astwinds90x60v.gif"
Ceci détermine l'adresse de votre première image. Dans
cet exemple l'image que j'ai insérée dans le menu se trouve
dans le dossier "interface" et le nom de
l'image est: astwinds90x60.gif, astwinds90x60
étant le nom de l'image et .gif étant
l'extension du fichier au format "gif".
Changez cette adresse par l'adresse de votre image.
Je vous conseille
d'utiliser des images au format .gif ou .jpg
car ce sont des formats beaucoup moins lourds que le format .bmp,
vos pages se chargeront plus rapidement.
Pour convertir vos images vous pouvez télécharger
Convertor qui est un utilitaire de conversion d'images *.bmp, *.gif,
*.jpg.
border="0"
Ceci determine la bordure de votre première image. Si vous souhaitez
ajouter une bordure a votre image, remplacez le "0"
par un chiffre suppérieur a "0"
Plus votre chiffre sera élevé, plus la bordure de votre
image sera épaisse
alt="Les
astuces d'Astwinds"
Ceci détermine le texte qui s'affichera lors du survol de la
souris sur la première image. Si vous mettez le pointeur de votre
souris sur l'image sans cliquer, une bulle apparaitra avec ce texte
"Les astuces d'Astwinds"
Remplacez ce texte par le texte que vous souhaitez voir s'afficher lors
du survol de la souris de vos visiteurs sur votre image.
<a href="http://www.astwinds.com/
">
Ceci représente le lien de votre deuxième image. C'est
vers cette adresse que votre visiteur sera dirigé lorsqu'il cliquera
sur la deuxième image.
Remplacez cette adresse par l'adresse vers la quelle vous souhaitez
que pointe votre lien lorsqu'un de vos visiteurs cliquera sur la deuxième
image.
img src="../interface/astwinds120X60s.gif"
border="0"
alt="Astwinds"
pour ces trois otpions de la deuxième image la description est
la même que pour la première image
Voila vous connaissez maintenant le détail du code changez juste
les textes en rouge par vos propres textes et vos propres adresses.
Pour rajouter d'autres images vous pouvez copier une ligne de code
et la coller a la suite. Par exemple vous copiez le code de la deuxième
image et vous le collez a la suite:
Voici notre code de départ avec une image en plus.Ici le code
de la troisième image est en vert. J'ai donc copié le
code qui est en violet et je l'ai collé a la suite: ici en vert
<!-- Début du code du menu déroulant
d'Astwinds-->
<noscript><a href="http://www.astwinds.com/">Menu
déroulant <br> d'Astwinds</A></noscript><marquee
Class="Scroller" bgcolor="#669999"
behavior="scroll" direction="up"
width="150" height="90"
scrollamount="2" scrolldelay="0" onmouseover="this.stop()"
onmouseout="this.start()">
<div align="center"><img src="../interface/astwinds90x60v.gif"
border="0" alt="Les
astuces d'Astwinds"></a></p>
<p><a href="http://www.astwinds.com/
" target="_blank"><img src="../interface/astwinds120X60s.gif"
border="0" alt="Astwinds"></a></p><p><a
href="http://www.astwinds.com/ " target="_blank"><img
src="../interface/astwinds120X60s.gif" border="0"
alt="Astwinds"></a></p></div>
</marquee>
<!-- Fin du code du menu déroulant d'Astwinds -->