Bonjour,
dans ce tutoriel, je vais vous montrer comment
ouvrir une nouvelle fenêtre, une
pop-up en javascript.
Ouvrir une pop-up, n'est pas nécessairement utilisé pour faire de la publicité, les pop-up servent surtout à
séparer de différents contenus, par exemple lorsque l'on veut afficher une image grand format, il est plus adapter de l'
ouvrir dans une nouvelle fenêtre, ou quand on clique sur un bouton d'aide, il est plus adapté d'avoir une fenêtre différente...
La méthode javascript pour ouvrir une nouvelle fenêtre est
window.open, cette méthode peut avoir plusieurs arguments, les voici:
- L'url de la nouvelle fenêtre - Simplement l'url qui sera chargée dans la nouvelle fenêtre.
- Le nom de la nouvelle fenêtre - Le nom de la nouvelle fenêtre, c'est très utile pour que deux fenêtres puissent communiquer entre elles.
- Les options - Différentes options permettant de configurer la nouvelle fenêtre, tel que sa taille, sa position...
il existe différentes options, certaines sont désactivée dans les navigateurs pour des raisons de sécurité.
voici les options généralement activées:
- with: la largeur de la fenêtre en px
- height: la hauteur de la fenêtre en px
- left: la position de la fenêtre à partir de la droite en px
- top: la position de la fenêtre à partir du haut en px
- menubar: affichage du menu, yes pour oui, no pour non
- toolbar: affichage de la barre d'outils, yes pour oui, no pour non
- scrollbars: affichage de la barre de défilement, yes pour oui, no pour non
Bon voici un code pour mieux illustrer le tout:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ouvrir une pop-up en javascript</title>
<script type="text/javascript">
<!--
function open_infos()
{
window.open('pageb.html','nom_de_ma_popup','menubar=no, scrollbars=no, top=100, left=100, width=300, height=200');
}
-->
</script>
</head>
<body>
<a href="#null" onclick="javascript:open_infos();">Ouvrir la Pop-Up</a>
</body>
</html>Essayer
Et pour finir, voici un tutoriel permettant d'ouvrir une nouvelle fenêtre et de la centrer:
Ouvrir une nouvelle fenêtre (Pop-up) et la centrer en javascript
Merci et j'espère que ce script vous sera utile.
Scripts et Tutoriels similaires
Le 06/02/2015 à 01:26:03
Ouvrir une nouvelle fenêtre (Pop-up) et la centrer en javascript
Image qui suit la souris en Javascript
Recharger/Actualiser une page en javascript
Empêcher le clic droit en Javascript (anticlicdroit)
Changer l'opacité d'un div(alpha) compatibles avec tous les navigateurs