Dans cet exemple, deux pages sont créées, comme le montre la figure 1. Index.html est la page affichée dans la sous-fenêtre et la page nommée firstpage.html contient un lien pour ouvrir Index.html dans la sous-fenêtre. Lorsque vous cliquez sur le lien, index.html s'ouvre dans une fenêtre enfant. Vous pouvez cliquer directement sur le lien « Fermer » dans la sous-fenêtre pour fermer la sous-fenêtre, ou vous pouvez l'ignorer. La sous-fenêtre se fermera automatiquement après 15 secondes.
Figure 1 Le fonctionnement spécifique de la page contextuelle du navigateur
est la suivante :
1. Générez un dossier Smlple sur le site local.
2. Dans le dossier Smlple, générez les fichiers nommés Index.html et firstpage.html.
3. Double-cliquez sur Index.html pour ouvrir le document et entrez dans la fenêtre d'affichage de conception du document.
4. Cliquez sur le menu Affichage/En-tête du contenu pour afficher la zone d'en-tête du document.
5. Cliquez sur le volet d'en-tête du document dans la fenêtre du mode Création. Sélectionnez le menu Insérer/Balises invisibles/Script pour ouvrir la boîte de dialogue Insérer un script. Comme le montre la figure 2, sélectionnez l'option JavaScript dans la zone de liste déroulante Langue et entrez « setTimeout("self.close()", 15000) » dans la zone de texte Coctento. Cliquez sur le bouton OK pour terminer le script qui ferme automatiquement la fenêtre enfant 15 secondes après son insertion dans l'en-tête du document. Dans le code, 15 000 signifie 15 000 millisecondes, soit 15 secondes. Vous pouvez également le modifier selon le nombre de millisecondes dont vous avez besoin.
Figure 2 Définir l'heure
6. Entrez le mot « Fermer » dans la fenêtre du document, entrez « ### » dans la zone de texte Lien du panneau des propriétés et définissez-le sur un lien vide.
7. Dans l'éditeur de balises rapides, à l'extrémité gauche de la barre d'état, cliquez sur le bouton Balise. Sélectionnez le lien « Fermer », puis appuyez sur la combinaison de touches Ctrl+T pour ouvrir l'éditeur de balises rapides et accéder au mode d'édition de balises de l'éditeur de balises rapides. Saisissez ensuite "onclick="selfclose()"" avant ">". Comme le montre la figure 3, une fois les paramètres terminés, cliquez sur le bouton OK pour confirmer l'opération. De cette façon, une fois Index.html ouvert en tant que sous-fenêtre, cliquer sur le lien peut immédiatement fermer la sous-fenêtre.
Figure 3 Définir l'heure
8. Enregistrez le fichier Index.html et quittez la fenêtre Dremweaver de index.html.
9. Commencez maintenant à concevoir la page firstpage.html. Dans le dossier Smlple du site local, double-cliquez sur fristpage.html pour ouvrir le document et entrez dans la fenêtre d'affichage de conception du document.
10. Saisissez les mots « Cliquez ici pour ouvrir une sous-fenêtre qui se fermera automatiquement » dans le document. Entrez ensuite "###" dans la zone de texte Lien du panneau des propriétés pour le définir comme lien vide.
11. Vous pouvez configurer la fenêtre Index.html pour qu'elle s'ouvre lorsque vous cliquez sur le lien en appliquant le comportement Ouvrir la fenêtre du navigateur au lien, mais une méthode plus pratique consiste à utiliser l'éditeur d'identité rapide. Pour ce faire, placez d'abord le point d'insertion dans le lien, puis cliquez sur le bouton Identité du sélecteur d'identité à l'extrémité gauche de la barre d'état pour sélectionner l'intégralité du lien. Appuyez ensuite sur la combinaison de touches Ctrl+T pour ouvrir l'éditeur de balises rapides et entrez dans le mode d'édition du logo de l'éditeur de balises rapides. Entrez ensuite "onclick="window.open('index.html',null','width=200px, height=200px')" avant ">" (comme indiqué dans la figure 4). Une fois le réglage terminé, appuyez sur la touche Entrée pour confirmer l'opération.
Figure 4 Configuration du lien pour qu'il s'ouvre lorsque vous cliquez dessus
12. Les opérations ci-dessus complètent les paramètres de cet exemple. Vous pouvez cliquer sur le menu et utiliser Fichier/Enregistrer pour enregistrer votre travail. Appuyez ensuite sur la touche F12 pour prévisualiser l'effet de page dans le navigateur.