all html : Le portail des webmaster
La communauté ALL HTML c'est 58299 membres à ce jour dont 1 inscrits aujourd'hui et 29 depuis une semaine.
Article publié le jeudi 01 juin 2006 par koala64.
Cet article est classé dans les catégories « Javascript »
Ce script est un gestionnaire de popup. Il est non intrusif (pas de code javascript dans la partie XHTML). Son principe est d'ouvrir chaque lien possédant une classe 'popup' dans une popup unique. Un paragraphe contenant un lien pour fermer la popup est généré sur la page principale.
<script src="popup.js" type="text/javascript"></script><a href="http://koalnet.com" class="popup">Koalnet</a><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Gestionnaire de popup (DOM)</title>
<script src="popup.js" type="text/javascript"></script>
</head><body>
<ul>
<li><a href="http://www.allhtml.com">Allhtml</a></li>
<li><a href="http://koalnet.com" class="popup">Koalnet</a></li>
<li><a href="http://www.alsacreations.com" class="popup">Alsacreations</a></li>
</ul>
</body></html>/**********************************************
Gestionnaire de popup (DOM)
koala64
**********************************************/
// Raccourci pour le script
var d = document;
// Creation d'un objet
var o = new Object;
// Creation d'une variable globale
var oNewWin = null;
// Proprietes Link de l'objet
o.Link =
{
// Gestionnaire de l'evenement onclick pour chaque lien du document
ClickHandler: function()
{
// On recupere l'ensemble des liens dans un tableau puis
// on parcourt le tableau. Si le lien possede une classe 'popup',
// on lance la fonction popup.
var oLink = d.getElementsByTagName( 'body' )[0].getElementsByTagName( 'a' );
for( var a = 0 ; a < oLink.length ; a++ )
if( oLink[a].className == 'popup' )
oLink[a].onclick = o.Popup.__Open;
},
// Creation d'un lien dans la page principale pour supprimer la popup
Destroy: function()
{
// On cree un paragraphe contenant un lien en lui donnant un identifiant,
// ce qui permet de le manipuler via css...
var oBody = d.getElementsByTagName( 'body' )[0];
var oP = d.createElement( 'p' );
oP.setAttribute( 'id' , 'popup' );
var oLink = d.createElement( 'a' );
oLink.setAttribute( 'href' , '#' );
var oTextLink = d.createTextNode( '' );
oTextLink.data = 'Fermer la popup';
oBody.appendChild( oP );
oP.appendChild( oLink );
oLink.appendChild( oTextLink );
// On affecte au lien la methode de fermeture de popup.
oLink.onclick = o.Popup.__Close;
}
}
// Proprietes Popup de l'objet
o.Popup =
{
// Methode d'ouverture de la popup
__Open: function()
{
// Si la popup n'existe pas, on en cree une avec le lien concerne puis
// on annule l'activation du lien dans la fenetre principale.
if( !oNewWin || oNewWin.closed )
{
oNewWin = window.open( this.href , '' , 'top=' + ((screen.height/2)-150) + ' , left=' + ((screen.width/2)-400) + ' , width=800 , height=300 , scrollbars=yes' );
return false;
}
// Si la popup existe et qu'on clique sur un autre lien possedant une classe 'popup',
// on passe l'url a la popup, on lui redonne le focus puis on annule l'activation du
// lien dans la fenetre principale.
else if( oNewWin && this.className == 'popup' )
{
oNewWin.location.href = this.href;
oNewWin.focus();
return false;
}
// Pour les autres cas, on active le lien dans la fenêtre principale.
else
{
return true;
}
},
// Methode de fermeture de la popup.
__Close: function()
{
if( oNewWin )
{
oNewWin.close();
oNewWin = null;
return false;
}
}
}
// Proprietes Script de l'objet
o.Script =
{
// Initialisation de l'objet
Init: function()
{
o.Link.ClickHandler();
o.Link.Destroy();
}
}
// Chargement de l'objet au lancement de la page.
window.onload = o.Script.Init;Plus d'informations :
Commentaire publié le jeudi 01 juin 2006 à 07 h 57 par breizh_web Commentaire publié le samedi 03 juin 2006 à 15 h 31 par koala64 
Commentaire publié le samedi 21 octobre 2006 à 20 h 54 par renaud91 Commentaire publié le jeudi 16 novembre 2006 à 13 h 58 par koala64 Vous devez obligatoirement vous identifier en tant que membre pour participer à cette discussion.
Discutez et échangez sur ce thème dans notre forum Javascript - DHTML - VBScript.
17/07/2008 à 19 h 18
Modifier un rollover et le passer en auto (1 réponse)
11/07/2008 à 13 h 33
Utilisation de variables dans un javascript (novice) (2 réponses)
10/07/2008 à 10 h 14
Permutation lien/ champ de formulaire... (1 réponse)
09/07/2008 à 14 h 40
Problème de conflit de commandes (1 réponse)
08/07/2008 à 21 h 47
mon script est trop lent ! (2 réponses)