08/01/2011, 10:09:06
Bonjour Manu,
Alors, tu as deux possibilités pour ce que tu veux faire : Javascript (comme tu le propose) ou CSS (plus simple).
Javascript :
Le mieux est de créer un bloc de contenu global (contenu > blocs de contenus globaux) avec ton code javascript. Attention il faut bien mettre la balise {literal} comme ceci :
Puis il faut placer ce bloc de contenu global dans ton gabarit de page (Contenu > Gabarits), entre les balises <head></head> avec un code du type :
Après, dans ton contenu :
Voilà, fin du javascript et après quelques adaptation ca devrait marcher.
Cela dit, je serai plus adepte de faire ce genre de choses en CSS. Un tuto là-dessus : http://innovablog.com/design/design-css-...css-image/
Pour résumer, on joue sur la position de l'image de fond d'un lien. Il faudra donc créer des fonds de boutons comprenant deux images : l'image normale et l'image survolée.
Bonne intégration !
Alors, tu as deux possibilités pour ce que tu veux faire : Javascript (comme tu le propose) ou CSS (plus simple).
Javascript :
Le mieux est de créer un bloc de contenu global (contenu > blocs de contenus globaux) avec ton code javascript. Attention il faut bien mettre la balise {literal} comme ceci :
Code :
{literal}<script type='text/javascript'>
/*
on precharge les images de substitution
*/
i1 = new Image;
i1.src = "[url]http://www.tonsite.com/img/image2.gif[/url]";
i2 = new Image;
i2.src = "[url]http://www.tonsite.com/img/image3.gif[/url]";
</script>
{/literal}
Puis il faut placer ce bloc de contenu global dans ton gabarit de page (Contenu > Gabarits), entre les balises <head></head> avec un code du type :
Code :
{global_content name='nom_du_bloc'}
Après, dans ton contenu :
Code :
<A HREF="tips_img_03.php" onMouseOver="nomimage1.src=i1.src" onMouseOut="nomimage1.src='http://www.editeurjavascript.com/scripts/img/image1.gif'">Passez votre souris ici !</A><BR>
<A HREF="http://www.editeurjavascript.com" onMouseOver="nomimage1.src=i2.src" onMouseOut="nomimage1.src='http://www.editeurjavascript.com/scripts/img/image1.gif'">Ou encore là !</A>
<!-- Vous pouvez mettre une image a la place du texte :) -->
<BR><BR>
<IMG SRC="http://www.editeurjavascript.com/scripts/img/image1.gif" BORDER=0 WIDTH=88 HEIGHT=31 HSPACE=0 VSPACE=0 NAME="nomimage1"><noscript><a href="http://www.editeurjavascript.com/">ajax</a></noscript>
Voilà, fin du javascript et après quelques adaptation ca devrait marcher.
Cela dit, je serai plus adepte de faire ce genre de choses en CSS. Un tuto là-dessus : http://innovablog.com/design/design-css-...css-image/
Pour résumer, on joue sur la position de l'image de fond d'un lien. Il faudra donc créer des fonds de boutons comprenant deux images : l'image normale et l'image survolée.
Bonne intégration !
Aire Libre // Création de sites web et services CMS Made Simple : intégration, développement, maintenance et dépannage // De l'Alsace vers le monde entier