Bonjour à tous,

Je viens vers vous pour vous demander de l'aide , car j'ai codé une page ou j'affiche un menu déroulant avec plusieurs liens.

J'aimerai quand le clique sur le lien que cela m'affiche une image dans la partie droit de ma page.
J'ai réussi a le faire avec le code suivant :

<a href="#" onclick="document.getElementById('monImage').src ='image/drapeau.png';document.getElementById('monImage').style.visibility='visible';">essai</a>
<img id="monImage" src="image/pixel.gif" style="visibility='hidden';">

Mon image s'affiche sans problème et sans rafraichir ma page. Maintenant ce que j'aimerai faire c'est aussi rajouter des informations qui sont enregistrée dans base de donné mysql. Comment je peux avoir les informations via le lien aussi?

En résumé je veux pouvoir cliquer sur le lien et que cela m'affiche l'image et les données de ma base sans rafraichir la page.

Merci à celui qui pourra m'aider.

Tu utilise le même principe, une balise p ou div en dessous de l'image. Mais utilise la propriété display:none; plutot que visibility:hidden pour ta balise texte, comme cela tu ne devrais voir que la balise interessante. Chaque balise doit avoir son id propre et avec le onClick tu pointe vers une fonction javascript avec l'id en paramètre. Dans la fonction, tu boucles toute tes balises texte et leur met leur display à none puis tu récupére ton paramètre et tu met son display à block.

voici le html, je te laisse l'écriture du javascript

<a href="#" onclick="document.getElementById('monImage').src ='image/drapeau.png'; document.getElementById('monImage').style.visibility='visible'; reset_texte('monTexte1');">essai1</a>
<a href="#" onclick="document.getElementById('monImage').src ='image/mat.png'; document.getElementById('monImage').style.visibility='visible';reset_texte('monTexte1');">essai2</a>
<img id="monImage" src="image/pixel.gif" style="visibility='hidden';">
<p id="monTexte1">Texte 1 récupèré de la BDD</p>
<p id="monTexte2">Texte 2 récupèré de la BDD</p>

Hello,

Merci pour ton aide.

Voilà mon code :

<a href="#" onclick="document.getElementById('monImage').src ='image/drapeau.png';document.getElementById('monImage').style.visibility='visible';reset_texte('monTexte1');">Afficher l'image</a> 
<img id="monImage" src="image/pixel.gif" style="visibility='hidden';">
<p id="monTexte1" style="visibility='hidden';"></p>

Pour le javascripte je suis un peu perdu .

Merci a ceux qui se donnera la peine de m'aider

salut, je me pose une question:
style="visibility='hidden';"
ou
style="visibility:hidden;"

j'utilise plutot
style="visibility:hidden;"
Je ne sais pas si d'autre syntax fonctionne également, et concernant le code proposé, je suis parti du code donnée en premier post sans vérifier son exactitude.

Pour en revenir à la question, je te conseille d'utiliser plutot la propriété display pour tes balises p. Ton code javascript doit boucler sur toute tes balises p pour leur mettre un display none, ensuite tu rend à la balise p dont l'id est en paramètre son display à block. Je suis pas un expert en javascript capable de pondre le code sans me tromper loguement et passer un certain temps de debuggage donc je te conseille de poser ta question le plus précisement possible dans le forum approprié. Sache également que tu sera bien mieux reçu si tu montre un premier essai de code.

Hello,

J'ai trouvé la solution.
Merci pour votre aide a tous..