A mon avis la modification doit s'opérer dans le Javascript.

Je ne suis pas connaisseur du Javascript (aaah si j'étais milliardaire je pourrais arrêter de bosser pour apprendre ^^), mais ce bout de code

pop.onclick = function()
{
 this.style.display = 'none';
};


est le responsable de la fermeture au clic sur la fenêtre popup.
Il faudrait trouver un moyen de le remanier pour qu'en l'appliquant sur un élément de la popup bien précise, ça fasse disparaître toute la fenêtre.

Je pense que ça doit être faisable. Peut être un expert du Javascript passera par là pour faire travailler sa matière grise tout en aidant quelqu'un dans la panade Smiley murf
Salut,

Ben le principe est très simple. si tu as un élément <div id="popup"> alors dans ce div tu peux très bien mettre :
<div>
<p>blabla1</p>
<p>blabla2</p>
<a href="javascript:cache_popup();">Fermer popup</a> 
</div>


avec dans le head le script ou bien l'appel au script :
function cache_popup() {
document.getElementById('popup').style.display='none';
}


Mais bon ça c'est le principe...

Comment ça se combine avec l'exemple que tu as mis en lien, il faudrait voir.

Sinon tu peux aller jeter un oeil là dessus :
http://clb56.freezee.org/include_in_page/

C'est un contexte différent et assez complexe (combinaison php/surcouche javascript) où tout est généré, cela ne repose donc pas sur les propriétés de style mais sur la création / "destruction" d'élément via le Document Object Model (DOM). Mais le comportement que tu souhaites y est présent.

Pour le résultat en JS c'est ici :
http://clb56.freezee.org/include_in_page/afficher_raccourcis_js.php
Modifié par clb56 (05 Sep 2006 - 16:02)
Bonjour,
Je propose d'ajouter une croix pour fermer en remplaçant le code cité par Paul Hewson par ceci :
// on efface la popup en cliquant sur la croix
entete=pop.getElementsByTagName('H1')[0]
avs=document.createElement("SPAN");
entete.appendChild(avs)			
avs.appendChild(document.createTextNode("X")); 
with(avs.style){position="absolute";right="3px";cursor="pointer";}
avs.title="Fermer";
avs.onclick=function()
 {this.parentNode.parentNode.style.display='none';}

Reste à enlever cursor:pointer dans le style de #pop1 et #pop2

pour faire comme ici si c'est ce que tu veux
Modifié par chmel (06 Sep 2006 - 14:23)
Bonjour à tous

j'ai trouvé des sujets très intéressants concernant la gestion de popup sans nouvelle fenêtre.
J'ai réussi à gérer cela à peu près comme je l'entend ici (ce site est en cours de modif, donc pages de test et code html assez bordélique, pas du tout dans les standards - sorry).

Cependant, les contenus que je dois afficher dans ces popups ont parfois des liens, et lorqu'un de ceux ci est activé, la pop se referme comme le prévoit le script décrit dans ce sujet. Et évidemment, ça m'embête bcp.
Je suis alors tombé sur ce sujet en cours... j'ai essayé les quelques solutions développées ci et là par chmel ou clb56, sans succès (je n'ai pas touché au mélange php/javascript, bien trop complexe pour moi, petit graphiste).
J'aimerai un tuto plus précis à partir des deux derniers exposés (ou un autre si c'est faisable), histoire de fermer ma popup avec le lien "fermer" en bas et uniquement avec ce lien.
Si un de vous pouvait me filer un petit coup de génie ??? Smiley cligne

J'ajoute en apparté que le contenu des popups qui devrait être masqué au chargement ne l'est pas, contrairement au très bon tuto développé ici. Peut être parce que le id des mes popups est généré de manière dynamique... Je n'ai pas encore trouvé la solution mais ceci est moins important pour l'instant.

Merci pour votre attention.
Modifié par punktitude (12 Sep 2006 - 13:06)
Suite à mon message ci-dessus, voici la solution qu'un de mes collaborateur a développé :
concernant le script qui commande l'ouverture et la fermeture des popups (modifications en gras) :
function pop()
{
    var myAs = document.getElementsByTagName('a');
    for (var a = 0; a < myAs.length; ++a) {
				// Si le lien a une classe de type pop
        if (myAs[a].className == 'pop') {
				// on extrait l'id de la popup à partir du href
            var pop = document.getElementById(myAs[a].href.substring(myAs[a].href.lastIndexOf('#') + 1));
            [b]var myButton = document.getElementById('fermer' + myAs[a].href.substring(myAs[a].href.lastIndexOf('pop') + 3));[/b]
				// si la popup existe on l'affiche (display block)
            if (pop) {       
                pop.style.display = 'none';
                myAs[a].onclick = function() {
                    thisPopup = document.getElementById(this.href.substring(this.href.lastIndexOf('#') + 1))
                    thisPopup.style.display = (thisPopup.style.display == 'none') ? 'block' : 'none';
                    return false;
                };

[b]// on efface la popup en cliquant dessus
			if (myButton) {
	                myButton.onclick = function() {
                    thisPopup = document.getElementById('pop' + this.id.substring(this.id.lastIndexOf('#') + 7))
                    thisPopup.style.display = 'none';
	                };
			}[/b]
            }
        }
    }
}

window.onload = pop;

J'ai créé une div en bas de popup qui commande la fermeture.
<div id="fermer6" class="fermer">fermer</div>

Le id (ici id="fermer6") est indéxé dynamiquement - c'est un site géré par du php, le numéro correspondant au numéro de la news.
Le class="fermer" est utilisé pour habiller la div.
Le problème de la popup qui s'affiche au chargement a été réglé de manière très simple :
nous avons simplement indiqué au style css qui la gère de ne pas l'afficher
.poparchive {
position: relative;
top: 0em;
left: center;
width: 610px;
border: 1px solid #000;
background: #fff;
z-index: 500;
margin:10px 0;
padding:10px;
[b]display:none;[/b]
}
punktitude a écrit :
nous avons simplement indiqué au style css qui la gère de ne pas l'afficher

Du coups : n'est plus accessible si js est désactivé
Smiley wingol