Demande aide : Menu + image selon lien actif

Fermé
Floriane - Modifié par Floriane le 19/02/2012 à 17:44
 Floriane - 21 févr. 2012 à 15:01
Bonjour,

Je vais faire un blog pour mon association sous Blogger et j'aimerai que la page « A propos de nous ! » ait une zone de diapo d'images changeant en fonction du sujet sélectionné.
J'ai trouvé le code mais je doute sur les parties à modifier pour que les points abordés soient en bleu, non soulignés, en police Verdana et que le texte associé au sujet sélectionné s'affiche dans la page en cours. Je me demande aussi si j'ai cerné toutes les modifications à faire dans le code.
D'autre part, que dois-je mettre là où il y a des petits points et dois-je installer ce code dans Gadget ?
Je vous remercie par avance pour votre aide sur le code suivant :

---------------------------------------------
<script language="javascript">

if (document.images) {

image0 = new Image
image1 = new Image
image2 = new Image
image3 = new Image
image4 = new Image
image5 = new Image

image0.src = "UrlImgage0.jpg"
image1.src = "UrlImgage1.jpg "
image2.src = "UrlImgage2.jpg.jpg"
image4.src = "UrlImgage3.jpg "
image5.src = "UrlImgage4.jpg.jpg"

}
</script>
<b><span class="Apple-style-span" style="font-family: Verdana, 'Times New Roman', serif;"><img border="0" name="imagename" src=" UrlImage0.jpg" /> </span></b><br />
<b><span class="Apple-style-span" style="font-family: Verdana, 'Times New Roman', serif;"><a href="......./" onmouseout="document.imagename.src=image0.src" onmouseover="document.imagename.src=image1.src" target="new">NomSujet1</a> </span></b><br />
<b><span class="Apple-style-span" style="font-family: Verdana, 'Times New Roman', serif;"><a href="......./" onmouseout="document.imagename.src=image0.src" onmouseover="document.imagename.src=image2.src" target="new">NomSujet2</a> </span></b><br />
<b><span class="Apple-style-span" style="font-family: Verdana, 'Times New Roman', serif;"><a href="......./" onmouseout="document.imagename.src=image0.src" onmouseover="document.imagename.src=image3.src" target="new">NomSujet3</a> </span></b><br />
<b><span class="Apple-style-span" style="font-family: Verdana, 'Times New Roman', serif;"><a href="http:// ......./" onmouseout="document.imagename.src=image0.src" onmouseover="document.imagename.src=image4.src" target="new">NomSujet4</a> </span></b><br />
<a href="http:// ......./" onmouseout="document.imagename.src=image0.src" onmouseover="document.imagename.src=image5.src" target="new">....<b><span class="Apple-style-span" style="font-family: Verdana, 'Times New Roman', serif;"> NomSujet5</span></b></a> <br />
<noscript><a href="http://www.editeurjavascript.com/">ajax</a></noscript>

6 réponses

AssassinTourist Messages postés 5709 Date d'inscription lundi 16 janvier 2012 Statut Contributeur Dernière intervention 29 février 2024 1 310
20 févr. 2012 à 11:13
Bonjour,

<a href="#" onmouseout ="..." onmouseover="">Lien</a>

Cliquer ne donnera rien.
0
Sombresonge Messages postés 106 Date d'inscription mardi 7 février 2012 Statut Membre Dernière intervention 19 avril 2015 9
20 févr. 2012 à 15:35
Pourquoi passer par du javascript pour déclarer tes images? Tu pourrais tout aussi bien construire tes liens directement en PHP et juste renseigner les propriétés onmouseover et onmouseout de tes liens.
0
Sombresonge Messages postés 106 Date d'inscription mardi 7 février 2012 Statut Membre Dernière intervention 19 avril 2015 9
Modifié par Sombresonge le 20/02/2012 à 19:27
Au vu de ton titre, je pense que ce que tu veux c'est afficher une bannière différente selon la page du site visitée.

EN php ça se fait très bien, il te suffit de tester la page active avec $_SERVER["REQUEST_URI"]
0
tito23 Messages postés 305 Date d'inscription mardi 10 août 2010 Statut Membre Dernière intervention 16 janvier 2013 4
20 févr. 2012 à 16:09
il faut changer les poitillés par l'url des sujets selectionnés, si tu sais pas essaie d'afficher une image dans ton blog et de voir l'url ou bien par firebug de firefox ou bien au clic droit
0
Bonsoir,

Tout d'abord, merci d'avoir répondu à mon appel. Le forum sera d'une grande aide dans le déploiement du projet de Blog Blogger pour mon association car au risque de faire grincer quelques dents : Avec ferveur, je fais mes armes dans la conception élaborée !

Pour revenir à mon attente, parmi les pages du blog, j'en veux une présentant mon association en plusieurs points comme sur ce site : http://optimisation-blogger.blogspot.com/2011/04/liens-avec-images-menu-selon-texte.html, où j'ai récupéré le code.

Cependant, je ne veux pas la même forme ni la même couleur et taille de police. Je souhaite aussi que chaque point (ou titre de partie développée) sélectionné par le visiteur s'affiche dans la page en cours avec le titre du point abordé souligné ou surligné et l'image associée active.

Pour arriver à ça, je cherche donc à savoir ce que je dois modifier dans ce code où la solution qui m'aiderait à y parvenir. Et aussi la procédure pour l'insérer.

Merci encore pour l'aide que vous pourrez m'apporter !
Flo
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Sombresonge Messages postés 106 Date d'inscription mardi 7 février 2012 Statut Membre Dernière intervention 19 avril 2015 9
21 févr. 2012 à 01:59
Pas sur de comprendre ce que tu souhaites. En gros, tu veux faire un rappel du menu sélectionné par un titre en début de page ?

Si ce n'est que ça, tu n'as besoin d'aucun script, il suffit de mettre une image titre qui correspond au fichier html, même pas besoin de traitement
0
Bonjour,

Dans la page présentant mon association, je veux ce menu avec image changeante : http://optimisation-blogger.blogspot.com/2011/04/liens-avec-images-menu-selon-texte.html

Par contre, je veux une police de forme (Verdana), de couleur (bleu) et de taille différente. Je souhaite aussi que chaque lien sélectionné (ou partie de la présentation) par le visiteur affiche le texte s'y rattachant dans la page en cours. Et dans le menu que le titre du point abordé soit souligné ou surligné et l'image associée active.

J'espère avoir été plus explicite pour que vous puissiez m'aider. Merci encore car vous êtes bien plus expérimenté que moi ! Ce qui améliorera mes connaissances !

Flo
0
AssassinTourist Messages postés 5709 Date d'inscription lundi 16 janvier 2012 Statut Contributeur Dernière intervention 29 février 2024 1 310
21 févr. 2012 à 09:55
Pour gérer le design du menu, il utilise ceci à plusieurs reprises :
<span class="Apple-style-span" style="font-family: Georgia, 'Times New Roman', serif;">


Faites votre propre classe en css (nommée Apple-style-span) ou enlevez le class et mettez dans style quelque chose du genre :
font-family: Verdana;color:blue;font-size:20px;


Pour en savoir plus sur ce qu'il faut mettre dans "style", regardez les tuto sur le css.
0
Merci de m'avoir éclairé sur la partie concernant la mise en forme du texte du menu.
D'autre part, si j'ai bien saisi, l'expression <a href="#" onmouseout ="..." onmouseover="">URL du texte</a> permettra que lien sélectionné par le visiteur renvoie le texte s'y rattachant dans la page en cours.

Reste à voir pour que le titre du point du menu abordé apparaisse souligné ou surligné et l'image associée active lors de la sélection. Mais je vais faire un petit tour sur les tutos CSS.

Et puis j'essayerai car je débute le déploiement de mon projet d'ici cette fin de semaine !
Merci ! Flo
0
AssassinTourist Messages postés 5709 Date d'inscription lundi 16 janvier 2012 Statut Contributeur Dernière intervention 29 février 2024 1 310
21 févr. 2012 à 11:58
Une semaine, c'est un peu court si vous débutez :$
Mais allez voir le Site du Zero qui a un bon tutoriel sur le css (entre autres) Il est très clair et facile à comprendre rapidement.
0
Sombresonge Messages postés 106 Date d'inscription mardi 7 février 2012 Statut Membre Dernière intervention 19 avril 2015 9
21 févr. 2012 à 13:36
Le lien ne renvoie pas le texte qui s'y attache, il permet juste de renvoyer vers une page précise de votre site. C'est dans cette page en question qu'il faut inclure le texte approprié.

Onmouseover et onmouseout dans le lien permettent quant à eux de faire varier les effets au survol de l'élément par la souris. En gros, lorsque votre souris passe au dessus du lien, la propriété définie dans onmouseover apparait (vous pouvez ainsi changer l'image du menu pour lui donner un effet sélectionné), et oumouseout permet de remettre a l'état initial lorsque le curseur quitte le lien.
0
Peut-être la mise en route parait rapide mais j'ai toujours appris comme ça ! Je suis une autodidacte !
Je vais donc ouvrir le blog blogger en accès privé pendant sa construction et apprivoiser la bête.
Vos réponses ont été pédagogues, ça m'a vraiment éclairé.
Je vais y travailler et venir d'ici quelques jours vous dire comment je pense ou j'ai finalement procédé.
En attendant, un grand MERCI !

A bientôt,
Floriane
0