TP manipulation de fenêtres (objet Window)

Retour au menu

  1. Gestion dynamique d'une fenêtre

    2. Ouvrir ou fermer une fenêtre ? (exo-fenetre1)

    Il s'agit d'écrire 2 boutons et 2 liens <A href=".."> dans une page.

    Attention !
    L'objet window courant sera fermé, c'est-à-dire le navigateur lui-même !

    • fermer la fenêtre par clic

    • fermer la fenêtre par mouseOver

    Ouvrir et fermer une fenêtre externe (exo-fenetre2)

    cet exercice propose 3 façons :
    1. par événement onClick sur 2 boutons, pour ouvrir et pour fermer
    2. par activation d'un hyperlien géré par le pseudo-protocole <A HREF=javascript:..
    3. par événement onMouseOver/Out sur un lien ou une image

    Ouvrir et fermer une fenêtre par événement

    1. clic sur un bouton
    2. clic sur un hyperlien
    3. onMouseOver/onMouseOut sur un hyperlien

    Gestion par bouton

    Gestion par clic sur un lien

    Gestion en pointant un lien

    Ouvrir ou fermer la fenêtre

    en pointant l'image ou en pointant ce lien

    Cache-cache avec une fenêtre (exo-fenetre3)

    La fenêtre est créée dès l'ouverture, mais immédiatement masquée.
    Les 4 boutons ci-dessous vont permettre de la gérer.

  2. Méthode setTimeOut()

    3. Simulation d'une montre digitale (exo-fenetre4)

    On affichera cette montre dans une fenêtre indépendante, lors de l'ouverture de la page courante
    1. Reprendre un exercice antérieur, par exemple exo-heure.html
    2. Pour simuler l'écoulement du temps, utiliser des appels récursifs de la fonction d'affichage quelle_heure() avec la fonction setTimeout() :
      setTimeout("quelle_heure()", 1000);
    3. Appeler la fonction quelle_heure() en réponse à l'événement onLoad sur la balise <body>
    4. Pour afficher la montre dans une petite fenêtre, faire appel à la méthode open(). Choisir les options de cette fenêtre : pas de barres, non modifiable.

    Exemple de réalisation :

    Automatisation avec la fonction setTimeOut() (exo-fenetre5)

    Lors du chargement du document courant, il s'agit de faire afficher un message de bienvenue, dans une nouvelle petite fenetre. Celle-ci sera refermée automatiquement au bout de quelques secondes.

    Projet : QCM

    On pose une question et on donne 5 secondes au joueur pour donner la bonne réponse, en cochant sur une case ou en sélectionnant un bouton radio.
    Construire un test de 10 questions puis donner les réponses avec le bilan du joueur L'affichage de la question dans une fenêtre auxiliaire démarre le décompte :
    delai = setTimeout(perdu(), 5000)
    Une réponse du joueur, qu'elle soit juste ou pas, arrête le temps et lance l'évaluation de la réponse :
    clearTimeout(delai); verification();

  3. Fenêtres d'informations

    4. Il s'agit d'afficher des informations (texte, image) associé à un mot, une phrase, une image, une zone ... dans une nouvelle fenêtre

    Fenêtre d'infos furtives (exo-pc-fen.html)

    Lorsque l'utilisateur passe la souris sur des zones particulières d'une image en coordonnées, ou d'un texte, une fenêtre surgit avec un texte descriptif ou une image, adapté à la zone pointée.
    Ceci est réalisé par un script qui réagit aux événements onMouseOver et onMouseOut, en respectivement ouvrant et fermant la fenêtre d'information. On pourra au choix utiliser une image (cartes de France, du métro, plan de l'académie, du 93) ou cette page où est déjà préparée une image en coordonnées d'un pc

    Examen d'un document choisi dans une liste (exo-choix-document.html)

    Le choix par l'utilisateur d'une option dans une liste, produit un événement de type onChange qui, en réaction, affiche un document ou une image dans une nouvelle fenêtre.

    ouvrir
    fermer

    Fenêtres de navigation (exo-web)

    Des moteurs de recherche ----- et ------ des cours d'informatique