Bonjour Javatwister,
Merci de ton code, je le mets sur le codepen ce soir.
window.open c'est un peu comme les vinyles, cela va revenir...Envoyé par Nosmoking
Bonjour Javatwister,
Merci de ton code, je le mets sur le codepen ce soir.
window.open c'est un peu comme les vinyles, cela va revenir...Envoyé par Nosmoking
Bonjour,
Le code ne fonctionne pas sur les deux premiers liens du codepen :
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3 <p id="trust"><a id="PS" href="#">Site sécurisé</a> <br /> <a id="GB" href="#">Satisfait ou remboursé</a></p>
Je pense que c'est EventListener qui n'est ajouté que pour les images de id="parent" alors qu'il s'agit de liens hors id="parent".
C'est formidable: tu as tout compris!
Donc, j'imagine que tu peux rectifier le code tout seul maintenant
Bonjour Javatwister,
Je vais essayer ce soir, honnêtement pas sûr d'y arriver car je ne comprends pas tout dans le code.
D'après ton html,
- tes liens directs n'ont pas d'id;
- tes liens popup ont un id;
- les liens popup sont dans le conteneur "trust" ou "menuhaut";
- donc, on ne va sélectionner que ces derniers
(Et même Explorer aura de quoi se réjouir d'un code aussi innovant )
Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13 const liens=document.links; for(let i=0;i<liens.length;i++){ if(liens[i].id && (liens[i].parentNode.id=="trust" || liens[i].parentNode.id=="menuhaut")) { liens[i].addEventListener("click",function(e){ const win2=window.open( "nouscab.php#"+this.id, "", "scrollbars=yes,resizable=yes,width=420,height=420" ); e.preventDefault(); }) } }
Encore MERCI.
J'essaye ce soir.
Je vous tiens informé.
Bonjour,
Dans le codepen, cela marche très bien pour id="trust" mais pas pour id="menuhaut".
Je suppose que le problème est que les liens à pop-up ne sont pas des enfants directs de id="menuhaut", ils sont dans une liste emboitée.
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6 <ul id="menuhaut"> <li><a href="b.php?a=A1AL&r=pxet&c=CGV">CGV et FAQ</a> <ul> <li><a href="b.php?a=A1AL&r=pxet&c=CGV">Conditions de vente (13 rubriques)</a></li> <li><a id="FP" href="nouscab.php#FP">Quels sont les frais de port ?</a></li> etc..
Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13 const liens=document.links; for(let i=0;i<liens.length;i++){ if(liens[i].id) { liens[i].addEventListener("click",function(e){ const win2=window.open( "nouscab.php#"+this.id, "", "scrollbars=yes,resizable=yes,width=420,height=420" ); e.preventDefault(); }) } }
Bonjour Javatwister,
Ton code fonctionne très bien sur le codepen.
Je le mets sur mon site de test pendant le week-end.
Je vous tiens informé.
Encore merci.
Bonjour,
Est_il possible de cibler des classes ?
Le sélecteur css serait :
La version réduite doit aussi convenir :
Code : Sélectionner tout - Visualiser dans une fenêtre à part li.comp i.trv a
ou même :
Code : Sélectionner tout - Visualiser dans une fenêtre à part i.trv a
Existe-t-il un équivalent en javascript ?
Code : Sélectionner tout - Visualiser dans une fenêtre à part i.trv > a
Cela a un rapport avec notre discussion pour nouveau développement.
Oui, mais il serait temps que tu cherches un peu par toi même et/ou que tu fasses des essais.Est_il possible de cibler des classes ?
Une fois de plus :
Les joies du CSS | Réponses sur forum | Simple comme JS | Essais libres autour de l'API G$$gle Maps
✂ ---------------------------------------------
developpez.net c'est aussi :
✔ Les meilleurs cours et tutoriels pour apprendre le CSS
✔ Les meilleurs cours et tutoriels pour apprendre le (X)HTML
✔ Les meilleurs cours et tutoriels pour apprendre le JavaScript
Bonjour NoSmoking,
Je comprends ta remarque mais je t'assure que je recherche par moi-même.
Les tutos javascript sont généralement assez incomplets.
Les tutos sont généralement complets mais ne traitent pas tous les sujets et problèmes que l'on peut rencontrer !Les tutos javascript sont généralement assez incomplets.
Petit coup de pouce : Localisation des éléments DOM avec les sélecteurs (sur MDN). Il faut également suivre les liens.
Les joies du CSS | Réponses sur forum | Simple comme JS | Essais libres autour de l'API G$$gle Maps
✂ ---------------------------------------------
developpez.net c'est aussi :
✔ Les meilleurs cours et tutoriels pour apprendre le CSS
✔ Les meilleurs cours et tutoriels pour apprendre le (X)HTML
✔ Les meilleurs cours et tutoriels pour apprendre le JavaScript
Bonjour NoSmoking,
Merci de tes liens, je vais explorer.
Bonjour,
J'ai bien avancé avec querySelectorAll, merci pour le lien.
Dans le codepen je rencontre un dernier problème.
J'aimerais remplacer les nombreuses déclarations const win=window.open () par une fonction avec plusieurs arguments : le lien, la hauteur, etc.
J'ai créé en fin de code un début de fonction avec un seul argument, l'event pour event.preventDefault();
Cela ne marche pas du tout.
Si vous pouviez me dire où est l'erreur...
Encore merci d'avance.
Comment ça "nombreuses"les nombreuses déclarations const win=window.open ()
Il y a encore (et toujours) des malentendus: tu n'as à déclarer la fonction qu'une fois dans la page.
Et j'emploie volontairement le mot fonction car c’en est une (native).
Bonjour Javarwister,
Désolé de t'énerver mais je ne comprends pas ta réponse.
Bon, si le codepen te semble bien j'enlève le projet de fonction à la fin et laisse le reste en l'état.
Bonjour,
Grâce à votre aide j'ai bien avancé.
Juste une question en passant.
Fonctionne sur tous les navigateurs sauf IE.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18 const prom = document.querySelectorAll ('div.prom > a[id]'); if (prom.length > 0) { for (let i = 0; i < prom.length; i++) { prom[i].addEventListener ('click', function (e) { const idImg = prom[i].id.split('X'); const id = idImg[0]; const height = idImg[1]; const win = window.open ('popup.php?nom='+id+'G.jpg', '', 'scrollbars=yes,resizable=yes,width=420,height='+height); e.preventDefault (); } ); } }
Voyez-vous un moyen de le rendre IE friendly ?
Je pense que c'est cette ligne qui pose problème : prom[i].addEventListener
effectivement IE « boggue » avec la déclaration de variable de boucle via le mot clé let : voir cette réponse.Fonctionne sur tous les navigateurs sauf IE.
Pas exactement, la question que tu peux également te poser est ai-je besoin de la variable i dansJe pense que c'est cette ligne qui pose problème : prom[i].addEventListenermala boucle ?
Dans son post #48 javatwister t'a donné la solution, il suffit de lire les réponses !
Les joies du CSS | Réponses sur forum | Simple comme JS | Essais libres autour de l'API G$$gle Maps
✂ ---------------------------------------------
developpez.net c'est aussi :
✔ Les meilleurs cours et tutoriels pour apprendre le CSS
✔ Les meilleurs cours et tutoriels pour apprendre le (X)HTML
✔ Les meilleurs cours et tutoriels pour apprendre le JavaScript
Bonjour NoSmoking,
Si tu poses la question c'est que la réponse est non.Envoyé par NoSmoking
Avec document.querySelectorAll je récupère un tableau.
Il me semble que FOREACH n'est pas compris par IE, donc j'emploie FOR.
Je vais voir la doc sur FOR.
Je vous tiens informés.
Vous avez un bloqueur de publicités installé.
Le Club Developpez.com n'affiche que des publicités IT, discrètes et non intrusives.
Afin que nous puissions continuer à vous fournir gratuitement du contenu de qualité, merci de nous soutenir en désactivant votre bloqueur de publicités sur Developpez.com.
Partager