Team-Masters.com
Que du Gratuit pour Webmasters
Ouvrir (et fermer) une fenêtre popup en Javascript
Les popups, bêtes noires du Web ?
Ces petites fenêtres s’avèrent pourtant très utiles lorsqu’il s’agit de donner une petite information à l’ouverture d’un site, ou pour confirmer une opération.
Le script suivant ouvre donc tout simplement un fenêtre dont le contenu sera une page HTML de votre choix. Il est à mettre dans l’entête de votre page (entre le <head> et </head>) :
<script language="JavaScript">
function petitefenetre()
{
window.open("page_a_definir.htm", "petitefenetre", "toolbar=no, location=no, directories=no, status=yes, scrollbars=yes, resizable=no, width=300, height=400, left=300, top=50");
}
</script>Pour appeler cette fenêtre, il suffit de créer un lien à l’endroit voulu de votre page :
<a href="#" onClick="petitefenetre()">Fenêtre ouvre toi!</a>
Pour créer un bouton fermeture de la fenêtre, placez le code suivant dans le code source de la fenêtre (ici page_a_definir.htm) :
<form>
<input type="button" value="Fermer la fenêtre" onClick="window.close()">
</form>Explications :
Pour ouvrir une fenêtre en javascript, on utilise la méthode (fonction)open().
window.open( [url] [,nom] [,propriétés])
La méthode open() possède donc 3 paramètres :
| Paramètre | Description |
|---|---|
| url | Adresse de la page à ouvrir dans la fenêtre |
| nom | Nom de la fenêtre, qui pourra être utilisé en temps que "target" depuis les autres pages html |
| propriétés | Propriétés de la fenêtre (hauteur, largeur, etc..) |
Les propriétés de la fenêtre
Les caractéristiques de la fenêtre sont définies à l’aide de différentes propriétés :
| Propriété | Description | Valeurs |
|---|---|---|
| directories | Afficher la barre des liens | yes, no |
| height | Hauteur de la fenêtre | taille en pixels |
| location | Afficher la barre d’adresse | yes, no |
| menubar | Afficher la barre de menu | yes, no |
| resizable | Possibilité de redimentionner la fenêtre | yes,no |
| scrollbars | Afficher les barres de défilement | yes, no |
| status | Afficher la barre de status | yes, no |
| toolbar | Afficher la barre d’outils | yes, no |
| width | Largeur de la fenêtre | taille en pixels |
| left | Position de la fenêtre à partir du bord gauche | valeur en px |
| top | Position de la fenêtre à partir du haut | valeur en px |
Fermer une fenêtre
Pour fermer une fenêtre, on utilise la méthode close().
window.close()
23 décembre 2004
Appliquez un filtre dynamique sur des images
Un effet Neon (II) sur du texte
Affichez un texte qui tremble en Javascript
Ouvrir une popup centrée sur l’écran
Un aura autour de votre texte
Un texte animé dans une boîte
Afficher un texte dans la barre de statut au survol d’un lien
Afficher l’heure courante dans un bouton
Faîtes apparaître un texte de gauche à droite qui s’arrête ensuite
Faîtes défiler des images en boucle (comme une visionneuse)
