Bonjour à toutes et à tous!

Voilà, je débute en JS et je cherche à savoir comment réaliser un code.

l'idée : j'aimerais, en cliquant sur des images se situant sur une page, pouvoir afficher du texte ou un tableau sur cette MEME page.
exemple : j'ai une image d'un poisson, je clique dessus et en dessous ça m'affiche toutes les variétés de poisson et les informations de chaque variété.

J'ai d'abord pensé à un switch puis à une fonction visibilité... mais j'avoue être un peu débutante et ne patauger un peu.
Si quelqu'un peut m'aider...

Je vous remercie

Il y a beaucoup de contenu à afficher ?

Est-ce que ton texte ou tableau s'apparente plus à une légende (de l'image du poisson), ou est-ce que le poisson s'apparente plus à un élément de menu redirigeant vers le contenu correspondant.

Dans le premier cas, modifier la propriété display d'un bloc affichant le contenu semble approprié. Je te redirige donc vers ce tuto

Dans le second cas, charger tous les contenus associés à toutes les images sur une même page pose plein de problèmes :

- le temps de chargement est plus long alors que l'utilisateur ne consultera pas forcément tous les contenus
- il n'y a pas d'URL propre à chaque contenu permettant de le retrouver facilement.
- une recherche Google sur la truite pourra mener vers ta page avec l'image du poisson, mais l'information sur la truite ne sera, pour autant, pas affichée (c'est très énervant)

Donc pour éviter ça il faut que ton image de poisson soit un lien vers une page indépendante affichant le contenu demandé (tu peux te tourner vers PHP pour plus de simplicité).

Si tu souhaites ne pas recharger la page, pour faire des animations ou autre, il faudra alors intercepter ce lien en Javascript (le "désactiver" en quelque sorte) et à la place charger le contenu demandé en Javascript avec XMLHttpRequest. Un tuto ici.

Je te remercie de ta réponse.
Mais je ne comprends pas trop la requete (même l'ayant lu)

En fait j'ai l'image du poisson et lorsque je clique dessus disons que j'ai un tableau qui apparait en dessous (contenant les informations) donc ce n'est pas une légende...
Mais j'aimerais que ça reste sur la même page... ptet en PHP nan?

Je fais la distinction entre deux méthodes d'affichage qui font exactement ce que tu veux mais qui diffèrent par leur accessibilité.

PHP est une troisième façon, mais qui t'oblige, techniquement, à changer de page. Si changer de page ne te pose pas de problème, opte pour une solution en PHP car c'est la façon la plus ergonomique de procéder.

Si tu ne veux pas qu'il y ait un changement de page quand tu cliques sur ton image, il faut se rabattre sur les deux autres méthodes.

La première méthode n'est valable que pour du contenu secondaire, car elle n'est pas accessible (problèmes de référencement, nécessite Javascript pour fonctionner, etc.), mais elle est simple : il suffit de changer la propriété display du bloc contenant les informations (le rendre visible ou invisible).

La deuxième méthode offre la même expérience utilisateur (contenu qui apparait sans changement de page), mais met en place une mécanique qui permet le référencement et l'accessibilité.

oui avec display! j'ai trouvé ce qu'il me fallait, un topic à peu près équivalent existait déjà :
http://www.siteduzero.com/forum-83-485 [...] -onclick.html

merci énormément d'avoir toute fois chercher avec moi une solution! c'est sympa

Bon WE

On cherche toujours la solution de facilité n'est-ce pas