Programmation Web, année 2019
Quelques ressources en lignes
- Le site des tutoriels du W3C est une référence pour les langages du WEB (langue anglaise).
- Pour les non-anglophones le site de mozilla possède de nombreuses ressources en français pour HTML5, CSS3 et JavaScript
- Le site openclassrooms permet également de réviser les bases HTML5 et CSS3.
- Déclancher une animation CSS
Dans le fichier TD3.html
ajouter une balise de script à
la fin du fichier script_TD3.js
.
Essayez de reproduire à l’aide du CSS et du JavaScript adapté l’exemple suivant qui n’utilise que des éléments div et les propriétés CSS transform ainsi que les transitions vu dans le TD2.
- Délimiter la zone
Faire un nouveau fichier script à ajouter après la
balise de TD3_script2.js
afin d’essayer d’améliorer le
résultat précédant en empéchant le carré bleu de sortir de sa zone comme
dans l’exemple suivant (vous pouvez utiliser la propriété clientWidth
des éléments HTML.
Les boucles for
- Lisez la documentation sur les boucles for
Indiquez quelle source vous avez utilisé et ajouté l’un des exemples
à TD3.html
- Une première boucle
Essayez de reproduire l’exemple suivant dans TD3.html
en
utilisant un nouveau fichier de script TD3_script3.js
.
- Une boucle un peu plus compliqué (à finir à la maison)
Le HSL
est un format de couleur permettant de jouer sur
la tonalité et la saturation d’une teinte de couleur donné.
Essayez de reproduire le visualisateur de couleurs suivant dans un
script TD3_script4.js
en imbriquant deux boucles
for
et un l’évènement oninput
sur l’élément
input
.
Faites en sorte qu’en cliquant sur une couleur, cela déclenche un
alert
qui donne le code de la couleur.
Compiled the: mer. 04 sept. 2024 12:49:35 CEST