|
POP-UP sur un texte |
|
|
Il s'agit d'une nouvelle petite fenêtre qui donne
une information supplémentaire quand on clique dessus avec la souris
mais que l'on peut placer à sa guise sur l'écran, voire la réduire
dans la barre des tâches .
Pour connaître le javascript, rien de
tel que de consulter le site adéquat : http://www.toutjavascript.com/
1. créer une nouvelle page web dans votre site et lui donner un nom : <infos.htm> par exemple, avec les informations destinées à cette fenêtre pop-up.
2. créer la page qui va ouvrir le lien ouvrant la nouvelle page : <page.htm> et l'enregistrer dans un répertoire de son choix.
3. taper les instructions ci-après entre les balises : <p> et </p> :
<p><a href="infos.htm" target="page" "onclick="window.open('','page', 'width=200,height200,scrollbars=1')">informations</a></p>
4. autre possibilité : un script dans <head> et un autre dans <body>
comme suit . Votre éditeur placera automatiquement les scripts au bon
endroit.
Relevez les signes //
qui permettent de donner par ligne une explication sans influence sur
la commande, de même d'ailleurs que le signe
<!--
Exemples
: <!-- JavaScript //
- JavaScript - -->
<html>
<head>
<meta name="author" value="Biblioscript.com">
<title>Ouverture d'une fenêtre 'popup'</title>
// location=yes/no : affiche ou non la barre d'adresse,
// toolbar=yes/no : affiche ou non la barre de boutons,
// directories=yes/no : affiche ou non la barre de boutons 'Nouveautés'...,
// menubar=yes/no : affiche ou non la barre des menus (Fichier, Edition...),
// resizable=yes/no : permet ou non le redimensionnement de la fenêtre,
// screenX= : placement de la fenêtre en abcisse,
// screenY= : placement de la fenêtre en ordonnée,
// scrollbars=yes/no : affiche ou non les ascenseurs,
// status=yes/no : affiche ou non la barre d'etat,
// width : donne la largeur de la fenêtre en pixels,
// height : donne la hauteur de la fenêtre en pixels.
<script language="JavaScript">
// fonction utilisable pour plusieurs fichiers dans la même fenêtre
'popup'
function popup(adresse){
window.open(adresse,'nom_de_la_fenetre','location=no,toolbar=no,directories=no,menubar=no,
resizable=yes,scrollbars=yes,status=no,width=200,height=150,screenY=100,screenX=100')
}
// fonction utilisable pour plusieurs fichiers dans des fenetres différentes,
de tailles et positions differentes
function popupmodulo(adresse, name, x, y, top, left){
window.open(adresse,name,'location=no,toolbar=no,directories=no,menubar=no,
resizable=yes,scrollbars=yes,status=yes,width='+x+',height='+y+'screenY='+top+',screenX='+left
}
</script>
</head>
<body>
<a href="javascript:popup('demo/fichier.html');">Cliquez pour ouvrir</a><br>
<br>
<a href="javascript:popupmodulo('demo/fichier.html', 'toto', 100, 300, 25, 100);">Cliquez pour ouvrir une
deuxième fois</a>
</body>
</html>
Remplacer bien sûr
le nom <infos.htm>
par le fichier qui contient vos sources fondamentales ; ainsi, chez nous, on
le nomme <urgence.htm>. Agir de même avec le nom
<informations>
remplacé par votre mot
personnel à cliquer !
Les mots soulignés seront vos choix .
