Formations en ligne

Grille d'évaluation

Pages applet

Cet exercice vous fera prendre contact avec les applet java qui permettent d'ajouter de l'interactivité à vos pages. 

Étape 1: Créez une nouvelle page normale dont l'arrière-plan est blanc. Liez cette page à la feuille de style int_ascenseurs2.css.

Étape 2: Téléchargez les fichiers .class suivants: dadexc.class, dadexc$1.class, dadexc$DraggerThread.class, dadexc$Drop.class, dadexc$MyFeedback.class, dadexc$MyLayout2.class, dadexc$Word.class directement dans le répertoire FRONTPAGE2000 (très  important).

Étape 3: Téléchargez aussi les fichiers suivants dans le même répertoire: Cellule.gif, Hi.au, Yahoo1.au, Drip.au, ThatHurts.au, Return.au.

Étape 4: Prenez le temps d'aller lire la section théorique Ajouter un applet dans le menu de droite.

Étape 5: Copiez le code ci dessous. Cliquez ensuite sur Insertion, Avancées, HTML. Collez le contenu du presse-papiers dans la fenêtre qui s'ouvre.

Étape 7: Cette étape n'est pas indispensable, mais elle permet de mieux voir où est situé l'applet sur la page. Cliquez sur l'onglet HTML dans le bas de la page et recherchez le code suivant, en gris pâle: <!--webbot bot="HTMLMarkup" startspan -->. Sélectionnez-le et effacez-le en faisant bien attention de rien enlever d'autre.

Étape 8: Enlevez aussi l'inscription finale: <!--webbot bot="HTMLMarkup" endspan -->, toujours sans toucher à rien d'autre. 

Étape 9: Enregistrez la page dans le répertoire FRONTPAGE2000 sous le nom La_cellule.htm. C'est une opération très importante à ce stade, car un applet ne fonctionne pas tant que la page dans laquelle il se trouve n'a pas été sauvegardée dans le même répertoire que les fichiers .class contenant le code dont il a besoin!

Étape 10: Voici à quoi devrait ressembler votre page lorsque vous sélectionnez à nouveau l'onglet Normal.

Étape 11: Testez votre page en mode Aperçu. Essayez de placer les réponses aux bons endroits et voyez le résultat.

Étape 12: Cliquez sur l'icône représentant l'applet et copiez-le. Fermez la page.

Étape 13: Créez une autre page au fond blanc. Liez cette page à la feuille de style int_ascenseurs2.css. Enregistrez-la immédiatement sous le nom Neurone.htm. Collez l'applet que vous avez copié au numéro précédent.

Étape 14: Cliquez deux fois sur l'applet pour faire apparaître la boîte de dialogue permettant de changer les paramètres (pour changer un paramètre on le sélectionne, puis on clique sur le bouton Modifier). Changez les paramètres suivants.

Étape 15: Téléchargez dans FRONTPAGE2000 l'image neurone1.jpg. Enregistrez une nouvelle fois votre page.

Étape 16: Voici venu le temps de travailler un peu! Regardez votre page en mode Aperçu et identifiez les 5 parties munies d'une étiquette (les rectangles vides). Allez ensuite changer les paramètres word1 à word3 en inscrivant les bonnes réponses. Ajoutez aussi word4 et word5. Testez ensuite le jeu et changez les réponses si nécessaires. N'oubliez pas de sauvegarder votre page!

Étape 17: Créez une troisième page nommée Genital_masculin.htm. Liez-la à la feuille de style int_ascenseurs2.css. Procédez exactement comme pour la précédente. Voici les paramètres à changer.

Étape 18: Téléchargez dans FRONTPAGE2000 l'image genital_m.jpg. Comme pour la page précédente, identifiez les 6 parties et changez les param name wor1 à word6 en conséquence. Enregistrez une nouvelle fois votre page.

Étape 19: Une dernière page à créer sur le même modèle que les précédentes et à enregistrer sous le nom Genital_feminin.htm. N'oubliez pas de la Lier à la feuille de style int_ascenseurs2.css. Voici les paramètres à changer.

Étape 20: Téléchargez dans FRONTPAGE2000 l'image genital_f.jpg. Comme pour la page précédente, identifiez les 8 parties et changez les param name wor1 à word8 en conséquence. Enregistrez une nouvelle fois votre page après l'avoir testée.

Étape 21: Refermez toutes les pages ouvertes. Ouvrez Identification2.htm et ajoutez les liens avec les pages créées. N'oubliez pas que les quatre premiers liens doivent se charger dans le cadre du bas alors que les deux derniers (Page 1 avec Identification.htm et Retour avec Corps_humain.htm) doivent utiliser la page entière.

Étape 22: Vérifiez le fonctionnement et enregistrez la page de cadres.