Want to make creations as awesome as this one?

Transcript

Réutilisez !

PAS-à-PAS assisté

OBJECTIF

L'élément HTML <div> (qui signifie division du document) est un conteneur générique qui permet d'organiser le contenu sans représenter rien de particulier.

1. Insertion d'une <div> dans la page

<div>BONJOUR</div><script></script>

L'attribut universel id définit un identifiant qui doit être unique pour l'ensemble du document.

2. Identification d'une <div>

<div id="message">BONJOUR</div><script></script>

On définit des règles de styles destinées à des éléments ou des groupes d'éléments particuliers dans la page. Par exemple, la couleur et la taille de la police...

3. Application d'un style sur la <div>

<div id="message" style="color:orange;font-size:30px">BONJOUR</div><script></script>

Le JavaScript est le langage côté client : le navigateur internet ou browser (Internet Explorer, Firefox, Chrome, Opera...) qui interprète le Script. Le rôle du JavaScript est donc de manipuler les elements de la page

4. Action sur la <div>

<script>document.getElementById("message").style.color="green";</script>

On peut agir sur les éléments de la page Genially. Il faut cependant réussir à repérer ces éléments...

5. Astuce pour masquer la fenêtre

setTimeout(function() { document.getElementsByClassName('icon-close')[0].click() }, 10);

L'élément HTML <input> est utilisé pour créer un contrôle interactif dans un formulaire web qui permet à l'utilisateur de saisir des données.

6. Insertion d'un Input (identifié)

<input style="border: 2px solid black;" id="saisie"><script></script>

On peut récupérer ou modifier le contenu des éléments.

7. Communication entre éléments

<script> setTimeout(function() { document.getElementsByClassName('icon-close')[0].click() }, 10);document.getElementById("message").innerText=document.getElementById("saisie").value;document.getElementById("message").style.color="green";</script>

VALIDER

FENAERT

NADAM

Les prémices du COUISE...

Les deux intervenants étaient :