Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

L'essentiel de JavaScript

Utiliser Modernizr

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Modernizr est une bibliothèque qui vous permet de détecter si le navigateur supporte telle ou telle fonctionnalité.

Transcription

Une autre bibliothèque JavaScript très populaire est Modernizr. Modernizr va me permettre de faire du « feature detection ». C'est-à-dire, de détecter si le navigateur auquel j'ai affaire supporte ou pas, une certaine fonctionnalité. Alors, pour télécharger Modernizr, je vous invite, quand vous développez votre site, à cliquer ici, sur Development build, et, quand vous cliquez là-dessus, vous arrivez sur une page qui vous donne la liste de tout ce que Modernizr est capable de détecter comme fonctionnalités. Voyez qu'il y en a un sacré paquet, ici, une fois que vous êtes prêts à le télécharger, vous allez, tout simplement, cliquer sur le bouton « build » qui va alors construire, pour vous, une version de Modernizr. J'ai déjà téléchargé Modernizr pour vous, pour gagner un petit peu de temps, le voici, Modernizr.js, c'est un fichier JavaScript, qui est minifié, et au niveau de ma page HTML, je vais appeler ce fichier Modernizr. Attention, cette fois-ci, il est quasiment obligatoire de l'appeler dans le « head » de la page. En effet, vous avez envie que cette bibliothèque JavaScript soit chargée très rapidement pour détecter le plus rapidement possible ce que votre navigateur supporte ou ne supporte pas. Donc, à cet endroit-là, je vais utiliser une balise « script », utiliser l'attribut SRC de cette balise « script », pour aller chercher Modernizr.js. Et puis, ici, un petit peu plus bas, dans ma page, mettons cela dans le fond, je vais utiliser un autre bloc « script », pour faire un « console.log » d'un objet particulier qui est créé grâce à cette bibliothèque Modernizr, cet objet, c'est tout simplement l'objet Modernizr, avec un M majuscule. Allons-voir dans le navigateur ce que cela donne. Donc, quand je vais sur ma page et que je la rafraîchis, vous voyez, dans la console, qu'il y a un objet Modernizr qui est créé, et cet objet contient plein de propriétés. Remarquez que toutes ces propriétés sont des propriétés booléennes, c'est-à-dire qu'elles sont égales soit à « false », soit à « true ». Et, il s'agit, en fait, de la liste de toutes les fonctionnalités que Modernizr est capable de détecter, si c'est marqué « true », eh bien mon navigateur supporte la fonctionnalité en question, et puis si c'est marqué « false », eh bien, mon navigateur ne la supporte pas. Donc, il est très simple pour moi, dans mon JavaScript, de faire des « if » et de dire, par exemple, « ifModernizr.hidden scroll », par exemple, cela renvoie soit « true », soit « false », donc, c'est très simple, avec un « if » de pouvoir réagir au fait que mon navigateur supporte ou ne supporte pas cette fonctionnalité particulière. Donc voilà comment fonctionne, ici, Modernizr. Alors, petite chose, une fois que vous aurez terminé le développement de votre page, vous reviendrez sur Modernizr.com, et vous cliquerez Download. Ici, vous pourrez cocher, vous-même, vous pourrez choisir quelles sont les fonctionnalités que vous avez envie de pouvoir détecter avec Modernizr. J'en ai choisi cinq, ici. Donc, je vais pouvoir maintenant cliquer sur « build » pour créer et télécharger une version allégée de Modernizr, qui ne sera capable que de détecter les fonctionnalités dont j'ai réellement besoin, dans mon JavaScript.

L'essentiel de JavaScript

​Ajoutez des fonctionnalités interactives à vos pages web avec JavaScript. Découvrez la syntaxe, le DOM, l'utilisation des bibliothèques JavaScript populaires, etc.

Aucun commentaire n´est disponible actuellement
 
Logiciel :
Spécial abonnés
Votre/vos formateur(s) :
Date de parution :26 avr. 2016
Durée :5h09 (47 vidéos)

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !