Discussion :

[senor]

Bonjour,

Après une recherche sur le forum, j'ai utilisé le code de cette discussion : https://www.developpez.net/forums/d1...e-souris-texte

Ça marche mais il manque quelque chose ; Pour faire simple, l'image s'est afficher en tout petit et semble t-il dans le cadre du texte que j'avais défini plus tôt. En fait, j'aimerai que l'image s'affiche comme si cela se faisait par-dessus la page web et en plus grand du coup (ou en taille originale de l'image).

L'url pour voir le rendu actuel (Sous "La pureté (Clarity)") : www.secretgarden109.fr/test/diamants/

Vous trouverez ci-dessous le code :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
<script type="text/javascript">
        function show(){
                document.getElementById('image').style.display = 'block';
                }
                
                function hide(){
                document.getElementById('image').style.display = 'none';
                }
        </script>
 
 
		<a href="#" onmouseover="show();" onmouseout="hide();">Les codes suivant.</a></br>
		<img id="image" style="display:none;" src="http://www.secretgarden109.fr/test/wp-content/uploads/2018/05/Pureté.jpg"/>

Merci par avance pour votre aide !

[johnlobs]

Bonjour ,

Si tu veux afficher l'image en grand il va falloir opter pour une option:

Definir l'image dans un container dont la taille est fixée au préalable.
Jouer sur le style en agrandissant l'image.

En ce qui concerne le deuxieme point ( superposition des images, effets etc) il faudra que tu aille jetter un coup d'oeil du coté du fameux Z-INDEX offert par CSS et qui te permettra de t'amuser comme tu le sens

Bon courage.

[Vil'Coyote]

sinon tu regarde du côté de jquery et des lightbox.