Mise à jour le jeudi 30 septembre 2010

Fiche DOM: modification dynamique des styles  Logo Applications

Objet de la fiche : Correction exercice


Retour au cours Retour au cours


Rappel de l'exercice


La consultation de site Internet est parfois pénible pour les personnes malvoyantes. Un bouton permettant d'augmenter la taille des éléments serait  bienvenue.

Une image (aup.gif) est positionné en haut à droite de la fenêtre du navigateur. Cette image sera insensible au scrolling.

Lorsque l'on clique sur la flèche (évènement onclick) la taille des textes est augmentée pour prendre une valeur de 22px.


Correction

  • Juste avant la balise <div id="Site"> il suffit d'insérer la directive suivante :
    <div style="position:fixed;top:5px;right:5px"><img style="cursor:pointer" onclick ="document.getElementById('i_body').style.fontSize='22px'" src="Images/Site/aup.gif" width="16" height="16" alt="" /></div>
  • et d'affecter un identificateur ( ici 'i_body') à la balise <body>:
    <body id="i_body" onload="window.open( 'popupvoyage.htm','Pub', 'width=285,height=320,top=50,left=50')">