☰

Google Chrome - Zoomen ohne Änderung des Ansichtsfensters

tag-icon • tag-icon google-chrome google-chrome-extensions zoom
Google Chrome - Zoomen ohne Änderung des Ansichtsfensters

Vielleicht habe ich etwas übersehen oder weiß nicht, wie ich meine Frage formulieren soll, aber ich konnte online nichts hierzu finden.

Ich möchte in Chrome zoomen, ohne den Ansichtsbereich oder die Website zu ändern. Wenn ich also eine Website vergrößere, kann ich ein Detail vergrößern, ohne dass mein responsives Design es verschieben und auf die „richtige“ Größe skalieren muss.

Gibt es hierfür eine Chrome-Erweiterung oder eine Möglichkeit, eine solche Zoomfunktion in Chrome zu aktivieren?

Antwort1

Wenn Sie über ein Präzisions-Touchpad (die meisten neuen Laptops sind damit ausgestattet) oder einen Touchscreen verfügen, können Sie zum Zoomen die Finger auseinanderziehen.

Antwort2

Diese Erweiterung ist genau das, was Sie suchen:Benutzerdefinierter Seitenzoom

aber leider gibt es keine Abkürzungen.

PS: Bedenken Sie, dass diese Erweiterung aus irgendeinem Grund Datenzugriff auf alle von Ihnen besuchten Websites anfordert.

Antwort3

Für macOS
Nehmen Sie eine Webseite. Drücken Sie zum Zoomen die Befehlstaste und die Taste „+“.

Für Windows
Nehmen Sie eine Webseite. Halten Sie die Strg-Taste gedrückt und scrollen Sie mit dem Mausrad nach oben.

Bearbeiten

1) Gehen Sie zu „Systemeinstellungen“ -> „Bedienungshilfen
“. 2) Wählen Sie „Zoom“ und aktivieren Sie „Tastaturkürzel zum Zoomen verwenden“.
3) Notieren Sie sich die Tastaturkürzel.
4) Standardmäßig ⌥– ⌘– =zum Vergrößern und ⌥– ⌘– -zum Verkleinern.

Antwort4

Benutzeragenten (Chrome, Firefox, Chrome für Android usw.) haben das Standardverhalten, den Textkörper auf 100 % des Ansichtsfensters einzustellen, genauer gesagt auf das visuelle Ansichtsfenster. Wenn also die Fenstergröße geändert wird, ändert sich das Ansichtsfenster (Layout und visuelle Darstellung), was dazu führt, dass es immerfitden Inhalt und verursacht andere (nicht immer) unerwünschte Folgen, wie z. B. eine Änderung des Layouts in Responsive Designs.

Wenn Sie einen Mobile-First-Ansatz verwenden, legen Sie den Textkörper min-width(in Ihrer Medienabfrage) auf einen absoluten Wert fest und verwenden Sie min-device-widthoder max-device-width, um Ihre Medienabfragen auszulösen.

Dies würde Medienabfragen nicht auslösen, wenn die Größe des Browserfensters geändert wird, sondern nur, wenn der Inhalt auf einem Gerät gerendert wird, dessen Größe in Ihrer Medienabfrage angegeben ist.

Z.B:

body {
width : 90%;
}

Und verwenden Sie Medienabfragen wie:

@media screen and (min-device-width: 960px) {

  body {
   width : 900px;
  }

// Other CSS Rules to apply when device width > 960px
}

Dadurch reagiert Ihr Layout auf Mobilgeräten, aber nicht auf Desktops, selbst wenn die Größe Ihres Browserfensters geändert oder gezoomt wird. Stattdessen wird eine horizontale Bildlaufleiste angezeigt, wenn der Inhalt gezoomt oder in der Größe geändert wird.

Mit diesem Ansatz können Sie auch auf die Verwendung des <meta name="viewport" content="width=device-width, initial-scale=1" >Tags verzichten (obwohl dies nicht empfohlen wird).

Hoffe das hilft!

verwandte Informationen