Médiaforma

All posts tagged chrome

Par défaut, l’accélération matérielle via la carte graphique est désactivée dans Google Chrome. Cette vidéo va vous montrer comment l’activer. Read more


Plusieurs acteurs se partagent le monde des navigateurs Web :

  • Sous Windows : Internet Explorer, Google Chrome, Mozilla Firefox, Safari et Opera.
  • Sous Macintosh : Safari, Opera, Google Chrome et Mozilla Firefox.
  • Sous Linux : Google Chrome, Mozilla Firefox et Opera.

Pourquoi pas me direz-vous ! Malheureusement, tout ce petit monde n’interprète pas toutes les instructions HTML/CSS de la même manière et il arrive que le rendu diffère d’un navigateur à l’autre. Dans la mesure du possible, je vous suggère d’installer tous les navigateurs compatibles avec votre système d’exploitation et de tester votre code sur chacun d’entre eux.


Cliquez ici pour accéder au pack eBook+vidéos HTML5, CSS3, JavaScript

Dans cette rubrique, je vais vous montrer comment remplacer les zones de saisie des deux exemples précédents par des curseurs. Pour l’instant, ce code ne fonctionne que dans Google Chrome. Voici le résultat que nous cherchons à obtenir :

Dans Firefox et Internet Explorer, les curseurs seront représentés par des zones de texte.

Les portions CSS et JavaScript du document sont identiques à celles de la rubrique précédente. Nous n’y reviendrons pas. Par contre, n’hésitez pas à vous reporter aux rubriques “Alignement avec un tableau” et “Codes couleur en JavaScript” pour avoir des informations complémentaires à leur sujet.

Examinons le code HTML.

<table>

 <tr><td colspan=2><div id="div1"></div></td></tr>

 <tr><td>Rouge</td><td><input id="rouge" min="0" max="255" value="0" onchange="changeCouleur(event)"></td></tr>

 <tr><td>Vert</td><td><input id="vert" min="0" max="255" value="0" onchange="changeCouleur(event)"></td></tr>

 <tr><td>Bleu</td><td><input id="bleu" min="0" max="255" value="0" onchange="changeCouleur(event)"></td></tr>

 <tr><td colspan=2><div id="hexa"></div></td></tr>

</table>

Comme vous pouvez le remarquer, les balises <input> (c’est-à-dire les zones de saisie) ont été remplacées par des balises <input>. Cette simple substitution provoque l’affichage de curseurs dans Google Chrome. Les attributs min et max définissent les valeurs minimale et maximale de chaque curseur : 0 et 255. L’attribut value indique la position du curseur à l’ouverture du document. Cet attribut étant initialisé à 0 pour les trois curseurs, ils seront tous trois positionnés au minimum à l’ouverture de la page. Enfin, pour relier la position de chaque curseur avec la couleur d’arrière-plan de la balise div1, il faut définir une fonction événementielle qui sera exécutée à chaque modification d’un des curseurs. Pour cela, il suffit de capturer l’événement onchange. La fonction exécutée a pour nom changeCouleur(). Son code est quasiment identique à celui utilisé dans les deux rubriques précédentes. Reportez-vous à la rubrique “Codes couleur en JavaScript” pour en savoir plus à son sujet.


Si vos pages Web affichent des publicités intempestives ou mettent beaucoup de temps à s’afficher, vous pouvez y remédier d’une façon radicale en installant un module spécialisé appelé Adblock Plus. Par son intermédiaire, vous bloquerez les traqueurs, les noms de domaine malveillants, les bannières, les pops-ups et publicités vidéos, y compris sur Facebook et YouTube !

Cette petite merveille est compatible avec Internet Explorer, Firefox, Google Chrome, Opéra, Safari et plusieurs autres navigateurs. Pour l’installer, rendez-vous sur la page https://adblockplus.org/fr/. Votre navigateur est automatiquement détecté et un bouton d’installation est affiché :

Cliquez sur le bouton Installer et validez l’installation. Quelques instants plus tard, vous êtes informé que les publicités sont bloquées sur votre navigateur :

Si vous utilisez plusieurs navigateurs, recommencez cette opération sur chacun d’entre eux pour en finir une fois pour toutes avec la publicité. Notez que la technique peut légèrement varier d’un navigateur à un autre.


La page de démarrage de Google Chrome a été modifiée contre votre volonté et vous vous demandez comment retrouver la page à laquelle vous étiez habitué ?

Cliquez sur l’icône Personnaliser et configurer Google Chrome, dans la partie supérieure droite de la fenêtre et choisissez Paramètres dans le menu. Cette commande affiche la page chrome://settings dans le navigateur. Dans le groupe d’options Au démarrage, cliquez sur le lien Ensemble de pages, à la suite de l’option Ouvrir une page ou un ensemble de pages spécifiques, entrez l’adresse de la page de démarrage que vous voulez utiliser et cliquez sur OK. Fermez puis rouvrez Google Chrome. La page de démarrage devrait maintenant avoir changé selon vos indications.


Dans cette vidéo, je vous propose de découvrir si votre navigateur Web utilise la puissance de la carte graphique. Pour cela, vous allez télécharger puis installer le programme Process Explorer de Mark Russinovich.

Rendez-vous sur la page http://technet.microsoft.com/fr-fr/sysinternals/bb896653 et cliquez sur Download Process Explorer. Le fichier téléchargé est au format ZIP. Rendez-vous dans le dossier de téléchargement, puis cliquez sur Extraire tous les fichiers. Choisissez un dossier pour l’extraction et validez. Double-cliquez enfin sur procexp.exe pour lancer Process Explorer.

La fenêtre principale de Process Explorer dresse la liste des processus exécutés sur l’ordinateur. Ces informations sont certes intéressantes, mais elles ne concernent pas le sujet qui nous intéresse ici. Nous y reviendrons dans une autre rubrique.

Lancez la commande System Information dans le menu View de Process Explorer. Une nouvelle fenêtre est affichée. Nous allons nous intéresser aux onglets CPU (c’est-à-dire processeur) et GPU (c’est-à-dire carte graphique).

Pour mettre à rude épreuve le ou les navigateurs installés sur votre ordinateur, rendez-vous sur la page http://ie.microsoft.com/testdrive/Performance/ParticleAcceleration/.

Ici par exemple, nous utilisons Internet Explorer 9. La puissance CPU est modérée et la puissance GPU est mise à contribution.

Affichons cette même page dans Chrome (ici, il s’agit de la version 14). La puissance CPU est supérieure et la puissance GPU pratiquement pas utilisée, et la fluidité de l’animation est moindre.

Réitérons ce test dans Firefox. Ici, il s’agit de la version 6.0.2. Même constat que pour Chrome : le GPU n’est pratiquement pas mis à contribution, contrairement au CPU, et la fluidité de l’animation n’est pas au mieux de sa forme.

Ce test n’est … qu’un test. A vous de comparer vos navigateurs sur d’autres pages fortement graphiques et d’en tirer vos propres conclusions.


Certaines pages Web peuvent refuser de s’afficher ou s’afficher de façon erronée dans la version Bureau du navigateur Internet Explorer 11. Cela vient du fait qu’elles ne reconnaissent pas IE11 ou qu’elles interdisent l’accès à ce navigateur. Vous pouvez contourner ces limitations en faisant passer IE11 pour un autre navigateur !

Appuyez sur la touche F12, basculez sur l’onglet Emulation (1) et choisissez le mode d’émulation dans la liste déroulante Chaîne de l’agent utilisateur (2). Ici par exemple, IE11 sera pris pour Google Chrome :