0. Rions un peu
J'ai tenté plusieurs fois de réaliser une fenêtre popup juste pour lire les détails concernant un article et sans quitter la page la page en cours. N'ayant pas réussit à le faire je me suis proposé de faire autre chose.
Quelques jours après une mélancolie
(longue histoire ...je vous expliquerai un jour ... ), je voulais faire autre chose pour me changer d'idée. Ainsi je suis parvenu à réaliser dans moins de 10 lignes de codes ce que je n'ai pas pu faire.
Quelques jours après une mélancolie
(longue histoire ...je vous expliquerai un jour ... ), je voulais faire autre chose pour me changer d'idée. Ainsi je suis parvenu à réaliser dans moins de 10 lignes de codes ce que je n'ai pas pu faire.1. Procédure et utilité
a. Un pop-up (de l'anglais pop-up window qui serait traduit en fancais : une fenêtre surgissante ou fenêtre qui apparait brusquement ) est une fenêtre secondaire qui s'affiche, parfois sans avoir été sollicitée par l'utilisateur devant la fenêtre de navigation principale lorsqu'on navigue sur Internet. (Voir Wikipedia)
Elle est tres utilisée dans des cas de publicités ou la lecture des détails concernant un article sur le web par exemple.
b. Comme dit ton un exemple bien fait vaux mieux que 10 tuto bien exepliqué : je réalise deux pages html : page_web.html et page_popup.html . En cliquant un liens dans page_web.html, une fenetre popup contenant page_popup.html s'ouvre avec les détails suivants :
largeur : 532px,
hauteur :320px
menubar=no --> C'est à dire que le popup n'a pas de barre de menu,
scrollbars=no --> C'est à dire qu'il n y a pas de barre de deffillement
Notons que le script java contient les définitions concernant la position de la page dans l'écran
page_web.html
<html>
<head>
<script language="javascript">
function PopupCentrer(page,largeur,hauteur,options)
{
var top=(screen.height-hauteur)/2;
var left=(screen.width-largeur)/2;
window.open(page,"","top="+top+",left="+left+",width="+largeur+",height="+hauteur+","+options);
}
</script>
<meta http-equiv="Content-Language" content="en-us">
<title>Page web simple avec popup</title>
</head>
<body>
<a href="javascript:PopupCentrer('popup.html',532,320,'menubar=no,scrollbars=no,statusbar=no')"> Cliquer ici pour acceder à la page popup</a>
</body>
</html>
<head>
<script language="javascript">
function PopupCentrer(page,largeur,hauteur,options)
{
var top=(screen.height-hauteur)/2;
var left=(screen.width-largeur)/2;
window.open(page,"","top="+top+",left="+left+",width="+largeur+",height="+hauteur+","+options);
}
</script>
<meta http-equiv="Content-Language" content="en-us">
<title>Page web simple avec popup</title>
</head>
<body>
<a href="javascript:PopupCentrer('popup.html',532,320,'menubar=no,scrollbars=no,statusbar=no')"> Cliquer ici pour acceder à la page popup</a>
</body>
</html>
page_popup.html
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<title> Popup page</title>
</head>
<body>
<div style="background-color:#CCCCCC; height:200px;">
Je suis un popup
</div>
</body>
</html>
Voila c'est tout. Si l'aticle vous semble interressant ou si vous avez des commentaires n'oublier pas à nous le faire savoir : monsar04(at)gmail.com / 00243997647154 <head>
<meta http-equiv="Content-Language" content="en-us">
<title> Popup page</title>
</head>
<body>
<div style="background-color:#CCCCCC; height:200px;">
Je suis un popup
</div>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire