wake-up-neo.com

Alternative zur Chrome-Erweiterung "Window Resizer"

Was sind angesichts der Kontroverse von kürzlich (Dezember 2013) über die Chrome-Erweiterung mit dem Titel "Window Resizer" einige alternative Lösungen, um den Chrome-Browser schnell für die Entwicklung von Responsive-Entwicklungstools anzupassen?

37
JoshuaDavid

Auflösungstest könnte eine mögliche Alternative sein. 

Auflösungstest ändert die Größe des Browserfensters für Entwickler um ihre Websites in verschiedenen Bildschirmauflösungen anzuzeigen. Es enthält eine Liste häufig verwendeter Auflösungen und die Möglichkeit, diese anzupassen Liste. Außerdem haben Nutzer die Möglichkeit, die Google-Browsergröße zu aktivieren.

Es ist im Chrome Webstore verfügbar:

https://chrome.google.com/webstore/detail/resolution-test/idhfcdbheobinplaamokffboaccidbal

26
flo

Eine andere native Lösung zum Testen responsiver Designs ist die Verwendung der integrierten Chrome-Entwicklertools. Wählen Sie Tools-> Developer Tools und klicken Sie dann auf das Zahnradsymbol in der rechten unteren Ecke des Fensters. Klicken Sie auf "Aktivieren" und dann auf "Gerätekennzahlen". Sie können die Auflösung angeben, die Sie replizieren möchten.

Durch Ändern des "Benutzeragenten" auf diesem Bildschirm legt Chrome die Gerätemetriken für das ausgewählte Gerät fest. Dies kann sich als nützlich erweisen, wenn Sie entscheiden möchten, wo sich die ansprechenden Haltepunkte für die bekannteren Geräte befinden sollen.

Dies ist nicht so einfach wie eine Erweiterung mit zwei Klicks, aber es hat den Vorteil, dass es eine erweiterungslose Lösung ist und genaue Bildschirmmessungen der tatsächlichen Geräte verwendet. 

30
Dave

SÌ!

E-Mail-Adresse, verchromtes Hauptdokument mit scorciatoie da tastiera .

Aprili usando
F12
O
ctrl+shift+i(Gnu/Linux oder Windows)
cmd+opt+i(Mac)
O
Menu> Strumenti> Strumenti per sviluppatori

BEARBEITEN: Screenshot wird nach der letzten Änderung des Chrom-Entwickler-Dokuments angezeigt.

screenshot - step 1 of 2screenshot - step 2 of 2

Una gif lo dice meglio!

gif screencast with all steps(suggerimento: apri l'immagine in una nuova scheda)

20
JorgeArtware

Um die Antwort von @ Dave zu aktualisieren, müssen Sie ab Chrome 35.0.1916.153 m links neben dem Zahnradsymbol das Symbol "Schublade anzeigen" (> =) auswählen, "Quellen" und dann die Registerkarte "Emulation" auswählen.

Um die aktuellsten Tools zu erhalten, besuchen Sie @FireCodings link , die Entwicklungstools für mobile Emulationen von Google, und laden Sie/install Chrome Canary herunter. Wählen Sie dann in Canary Tools-> Developer Tools aus, klicken Sie auf das Mobile-Symbol in der oberen linken Ecke des Tools-Fensters (unten im Browser), klicken Sie auf Sources und dann auf Emulation. Die Informationen befinden sich auf dem Google-Seitenlink, um die Verwendung der Tools zu veranschaulichen.

3
user2603432

Eine weitere (sicherere) Alternative ist, Sie zu besitzen. 

Google hat viel Dokumentation zum Erstellen von Erweiterungen. Ich habe diese wirklich einfache Erweiterung gemacht, die alles, was ich für ein Projekt brauche, bietet. Den Code dazu finden Sie auf github

2
graham

Hier ist ein Lesezeichen-Fenster für die Größenänderung von Fenstern, das hervorragend funktioniert:

http://lab.maltewassermann.com/viewport-resizer/

2
Jeff

Tatsächlich ging der Entwickler zurück und entfernte schließlich den anstößigen Code ("Ecolinks") aus seiner Erweiterung. Ab heute soll das Affiliate-Zeug verschwunden sein.

Quelle: https://productforums.google.com/d/msg/chrome/mlAD1ygc0v0/gKLKWxoGrkIJ

Changelog für Version 1.9.0.3

Version 1.9.0.3 (2014-01-15): Aufgrund der großen Nachfrage habe ich .__ entfernt. die EcoLinks.

2
matt.nguyen

Speichern Sie unter Windows mit AutoHotKey das installierte Verzeichnis in resize-chrome.ahk, und doppelklicken Sie zum Ausführen:

WinMove, ahk_exe chrome.exe,, 0, 0, 1024, 768
0
zupa