Bonjour,
Je bosse en tant que Content Marketer pour le site Wordpress d'un client et n'ai aucun accès hors des pages. J'ai intégré un script afin de pouvoir avoir un pop-up qui se génère sur les fiches produits (25 par page). Il fonctionne très bien, un seul pb : je suis obligé de faire un script différent par produit. Etant assez nouveau en JS je suis ouvert aux suggestions pour n'avoir qu'un script et l'appeler pour chaque pop-up différents.
D'avance merci !
Un produit type
<script>
// When the user clicks on <div>, open the popup
function myFunction0() {
var popup = document.getElementById("myPopup0");
popup.classList.toggle("show");
}
</script>
<div class="popup" onmouseenter="myFunction0()" onmouseleave="myFunction0()">
<h4>Coudes femelle-femelle - Angle 22°30</h4>
<img src="https://www.dyka.fr/wp-content/uploads/ ... FF2230.png" width="400" height:"400"="">
<span class="popuptext" id="myPopup0">
<strong>Diamètres disponibles </strong>
<p>32 / 40 / 50 / 100</p>
<img src="https://www.dyka.fr/wp-content/uploads/NF-Embed.png" alt="nf logo" width="40" height:"40"="" style="margin: 0px 0px 0px 40%;"><p>E* + Me</p>
</span>
</div>
Popup JS
Re: Popup JS
Bonjour,
Le principe est d'appeler un paramètre pour n'avoir qu'une seule fonction avec num en paramètre
La fonction ouvre le popup appele "myPopup" concaténé à num :
Pour l'appel, on écrit :
Et on peut en ajouter simplement en changeant l'appel
myPopup123 et myFunction(123)
Le principe est d'appeler un paramètre pour n'avoir qu'une seule fonction avec num en paramètre
La fonction ouvre le popup appele "myPopup" concaténé à num :
Code : Tout sélectionner
<script>
// When the user clicks on <div>, open the popup
function myFunction(num) {
var popup = document.getElementById("myPopup"+num);
popup.classList.toggle("show");
}
</script>
Code : Tout sélectionner
<div class="popup" onmouseenter="myFunction(0)" onmouseleave="myFunction(0)">
<h4>Coudes femelle-femelle - Angle 22°30</h4>
<img src="https://www.dyka.fr/wp-content/uploads/ ... FF2230.png" width="400" height:"400"="">
<span class="popuptext" id="myPopup0">
<strong>Diamètres disponibles </strong>
<p>32 / 40 / 50 / 100</p>
<img src="https://www.dyka.fr/wp-content/uploads/NF-Embed.png" alt="nf logo" width="40" height:"40"="" style="margin: 0px 0px 0px 40%;"><p>E* + Me</p>
</span>
</div>
myPopup123 et myFunction(123)
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php
https://www.toutjavascript.com/livre/index.php