Tableau avec images en pop-up
Bonjour,
Je suis en train de travailler sur une petite page web mais je suis en train de bloquer sur des éléments de jQuery. J'essaie de suivre les tutos trouvés en ligne mais malgré cela je ne parviens pas à résoudre mon problème. (la solution est surement sous mes yeux, mais à force d'être dessus je ne le vois plus)
Voici la page : https://dev.laurenegrisot.fr/ranges-def/index2.php
Lorsque l'on clique sur un chiffre, une image s'affiche. J'aimerais qu'elle s'affiche en pop-up a l'endroit de la case et que lorsque l'on clique ailleurs, l'image se ferme.
J'ai essayé de partir de ce tuto, mais il semblerait que ça ne convienne pas ( https://www.w3schools.com/w3css/tryi...ss_modal_close )
Voici les éléments que j'ai
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
| <div id="clear">
<div id="image" >
</div>
<div id="image2">
</div>
</div>
<script>
var x = 0;
var y = 0;
var z = 0;
function loadImage(img) {
// Get the modal
var modal = document.getElementById("image").innerHTML = "<img src='images/" + img + "'/>";
}
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
</script> |
Il est possible que ma question soit totalement stupide et je m'en excuse, j'essaie de me mettre au jQuery mais je n'ai pas encore tout saisi malgré les nombreux tutos que je lis
Merci de votre aide !
