Passer au contenu principal
Formation développeur web
  • Accueil
  • Plus
Vous êtes connecté anonymement
Connexion
Accueil
Passer Hébergement
Hébergement


Vous n'avez pas encore votre propre espace web pour héberger vos projets ? Noms de domaines, Wordpress, VPS, espace de stockage : hébergez vos projets web dès maintenant, à partir de 1€ / mois.

Passer Formation
Formation


Vous êtes intéressé par le secteur du web, de l'informatique, de la programmation ? Que ce soit pour une formation qualifiante ou ponctuelle, en présentiel ou à distance, financée par l'état, par l'alternance, le CPF, etc...  Contactez-moi afin de vous orienter correctement.

  1. Front-end
  2. Programmation événementielle
  3. Theme builder
Devoir

Theme builder

Conditions d'achèvement
Ouvert le : lundi 17 août 2020, 00:00

Dans cet exercice, on va mélanger les notions vu sur le chargement du DOM, les notions d'événements sur les formulaires, et la manipulation du DOM.

Pour contextualiser dans un exercice concret, je vous demande de réaliser le code d'une petite interface qui permet de changer le style d'une page web. On parlera alors souvent de "thème" (cqfd : thème graphique).

Téléchargez le fichier en pièce jointe, c'est important. Basez-vous là-dessus pour réaliser votre travail. C'est important car vous n'aurez pas toujours la main sur le code HTML quand vous travaillez en JavaScript, il faut donc savoir s'adapter avec "les moyens du bord".

Important : pour ceux qui ont fini l'exercice, voici quelques idées que vous pouvez rajouter dans le theme builder :

  • pouvoir changer l'image de fond de la page. Proposer 3 ou 4 images dans le theme builder, quand l'utilisateur cliquera dessus, ça définira l'image comme étant l'image de fond de la page web
  • pouvoir changer les polices de caractères : télécharger 2/3 polices gratuites sur Internet, et proposez de pouvoir modifier la police par défaut au travers d'un élément de formulaire dans le theme builder

Exemple pour gérer l'image de fond :



Vidéo :

 

http://webboy.fr/pluginfile.php/2708/mod_assign/intro/themeBuilder.mp4
 

  • index.html index.html
    17 août 2020, 20:16
Contacter l'assistance du site
Vous êtes connecté anonymement (Connexion)
Résumé de conservation de données
Obtenir l'app mobile
Fourni par Moodle