From 004b3c5fc8d71b68fcb019c9e0346bf80024dbbd Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:48:47 +0100 Subject: unslug nl: move --- files/nl/tools/responsive_design_mode/index.html | 93 ++++++++++++++++++++++++ 1 file changed, 93 insertions(+) create mode 100644 files/nl/tools/responsive_design_mode/index.html (limited to 'files/nl/tools/responsive_design_mode/index.html') diff --git a/files/nl/tools/responsive_design_mode/index.html b/files/nl/tools/responsive_design_mode/index.html new file mode 100644 index 0000000000..2158a40f54 --- /dev/null +++ b/files/nl/tools/responsive_design_mode/index.html @@ -0,0 +1,93 @@ +--- +title: Responsive Design View +slug: Tools/Responsive_Design_View +translation_of: Tools/Responsive_Design_Mode +--- +

Responsive design past zich aan verschillende beeldgroottes aan om een presentatie te voorzien dat werkt voor verschillende soorten apparaten, zoals mobiele telefoons of tablets. Het Responsive Design View maakt het gemakkelijk om te zien hoe jouw website of app er zou uitzien op verschillende beeldgroottes.

+ +

{{EmbedYouTube("LBcE72sG2s8")}}

+ +

Het screenshot hieronder laat een mobiele versie zien van een Wikipedia-pagina met een grootte van 320 op 480.

+ +

+ +

Het Responsive Design View werkt vlot omdat je snel en precies de grootte van het beeld kan aanpassen.

+ +

Je kan natuurlijk ook de grootte van het browservenster aanpassen; maar als je het browservenster kleiner maakt, maak je ook de andere tabs kleiner, zo wordt het moeilijker om de browserinterface te gebruiken.

+ +

Als het Responsive Design View is ingeschakeld, kan je verder surfen in het verkleinde beeld.

+ +

Aan- en afzetten

+ +

Er zijn drie manieren om Responsive Design View mode aan te zetten:

+ + + +

en drie manieren om Responsive Design View af te zetten:

+ + + +

Vergroten / verkleinen

+ +

Je kan het inhoudsvlak vergroten of verkleinen op twee manieren:

+ + + +

Als je de grootte aanpast door de zijkanten te verslepen, kan je Control (Cmd bij OS X) ingedrukt houden om de snelheid van de aanpassing te vertragen. Dit maakt het gemakkelijker om een precieze grootte te selecteren.

+ +
+

Responsive Design View controls

+ +

Aan de bovenkant van het venstertje van het Responsive Design View, staan vijf knoppen:

+ + + + + + + + + + + + + + + + + + + + + + + + +
SluitenSluit het Responsive Design View en browse verder zoals voordien.
Select size +

Kies een voorgemaakte combinatie tussen breedte en hoogte of maak er zelf één.

+ +


+ Vanaf Firefox 33 zijn de nummers die hier staan direct aanpasbaar. Zo kan je gemakkelijk eigen dimensies toevoegen.

+
Portret/LandschapWissel het scherm tussen een portret view en een landschap view.
+

Simuleer touch events

+
+

Schakel touch event simulatie in of uit: als touch event simulatie is ingeschakeld, worden muis events omgezet naar touch events.

+
+

Neem een screenshot

+
Neem een screenshot van het inhoudsgebied. +

Screenshots worden opgeslagen in de standaard downloadlocatie van Firefox.

+
+
+ +

 

-- cgit v1.2.3-54-g00ecf