La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

TP n°2 Javascript EVENEMENTS ET OBJETS

Présentations similaires


Présentation au sujet: "TP n°2 Javascript EVENEMENTS ET OBJETS"— Transcription de la présentation:

1 TP n°2 Javascript EVENEMENTS ET OBJETS
Événements souris Analyse de code javascript Balise <div> Gestion de fenêtre Informations sur le navigateur et l’écran © BTS IRIS 2002 [tv]

2 Exercice n°1: Événements souris
Placer une image dans un lien <a>. Installer un gestionnaire d’événement qui permet de changer l’image lorsque le pointeur de la souris se trouve sur ce lien. On revient sur l’image d’origine lorsque le pointeur de la souris quitte ce lien. Le gestionnaire d’événement sera réalisé par une seule et unique fonction qui recevra en argument l’action à réaliser. Le pointeur de la souris est positionné sur l’image : elle devient bleue Le pointeur de la souris quitte l’image : elle redevient rouge

3 Exercice n°2: Analyse de code js
Tester l’exemple suivant : <html> <head> <title>Exemple JavaScript</title> </head> <body onload='window.setInterval("scroller()",100);'> <script language="JavaScript"> var text = 'Bienvenue sur mon site web ...'; var spaces = ' '; var i = spaces.length; function scroller() { i--; if(i > 0) window.status = spaces.substr(0,i) + text; else window.status = text.substr(-i); if(i < -(text.length)) i = spaces.length; } </script> </body> </html> Que fait ce script ? Placer, à l’intérieur de ce script, des commentaires pertinents.

4 Exercice n°3: Balise <div>
Écrire un script js qui permet de compter le nombre de caractères tapés au clavier. On utilisera des balises <div> pour afficher un texte d’aide en couleur lorsque le pointeur de la souris est placé sur les 3 éléments suivants : Exemple de balise <div>: <div id="countinfo" style="position:absolute; left:220px; top:15px; visibility: hidden"> <table border=0 cellspacing=0 cellpadding=4> <tr><td bgcolor=#00ff77> <font size=2 face="arial,helvetica" color=#333333><b> Ici est indiqué le nombre<br> de caractères saisis.<br> </b></font> </td></tr></table> </div>

5 Exercice n°4: Gestion de fenêtre
Écrire un script js qui crée, au chargement de la page, une nouvelle fenêtre qui se fermera automatiquement au bout de 3 secondes.

6 Exercice n°5: Informations sur le navigateur et l’écran
Écrire un script js qui affiche les informations concernant le navigateur et l’écran du client. Pour cela, vous utiliserez les propriétés des objets Navigator et Screen. Indiquer l’intérêt d’obtenir de telles informations.


Télécharger ppt "TP n°2 Javascript EVENEMENTS ET OBJETS"

Présentations similaires


Annonces Google