À la lumière de la controverse récente (décembre 2013) Outre l'extension Chrome intitulée "Window Resizer", quelles sont les autres solutions permettant de redimensionner rapidement le navigateur Chrome pour tester le développement réactif ?
Réponses
Trop de publicités?
Dave
Points
447
Une autre solution native pour tester les conceptions réactives consiste à utiliser les outils de développement intégrés de Chrome. Choisissez Outils->Outils du développeur, puis cliquez sur l'icône en forme d'engrenage dans le coin inférieur droit de la fenêtre qui s'affiche. Cliquez sur "Enable" (Activer), puis sur "Device Metrics" (Mesure des périphériques) et vous pouvez spécifier la résolution que vous souhaitez reproduire.
En outre, en modifiant l'"agent utilisateur" sur cet écran, Chrome définit les paramètres de l'appareil choisi, ce qui peut s'avérer utile pour déterminer les points d'arrêt réactifs pour les appareils les plus populaires.
Ce n'est pas aussi facile qu'une extension en deux clics, mais cela présente l'avantage d'être une solution sans extension et d'utiliser les mesures exactes des écrans des appareils réels.
Le test de résolution pourrait être une alternative possible.
Le test de résolution modifie la taille de la fenêtre du navigateur pour permettre aux développeurs de prévisualiser leurs sites Web dans différentes résolutions d'écran. Il comprend une liste de résolutions couramment utilisées et la possibilité de personnaliser cette liste. liste. Il donne également aux utilisateurs la possibilité d'activer la taille du navigateur de Google.
Il est disponible dans le webstore de Chrome :
https://chrome.google.com/webstore/detail/resolution-test/idhfcdbheobinplaamokffboaccidbal
JorgeArtware
Points
671
shpeley
Points
97
Pour mettre à jour la réponse de @Dave, à partir de Chrome 35.0.1916.153 m, vous devez sélectionner l'icône Afficher le tiroir (>=) à gauche de l'icône de l'engrenage, sélectionner Sources puis l'onglet Émulation.
Pour obtenir les outils les plus récents, consultez le site @FireCodings. lien aux outils de développement d'émulation mobile de Google, et télécharger/installer Canari chromé . Ensuite, dans Canary, choisissez Outils->Outils du développeur, cliquez sur l'icône mobile dans le coin supérieur gauche de la fenêtre des outils (en bas du navigateur), cliquez sur Sources, puis sur Émulation. L'information est là sur le lien de la page Google pour démontrer comment utiliser les outils.
graham
Points
811
Une autre solution (plus sûre) consiste à fabriquer ses propres produits.
Google a beaucoup de documentation sur la création d'extensions. J'ai fait ceci extension très simple qui fait tout ce dont j'avais besoin pour un projet, vous pouvez également trouver le code pour cela sur github .
