Skip to content

Commit fdc2288

Browse files
shubhamg13emilio
authored andcommitted
Move definition of Visual Viewport from CSSOM-View
Signed-off-by: Shubham Gupta <shubham.gupta@chromium.org>
1 parent 966052c commit fdc2288

2 files changed

Lines changed: 21 additions & 16 deletions

File tree

css-viewport-1/Overview.bs

Lines changed: 19 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -91,24 +91,38 @@ For [=paged media=], the initial containing block is based on the page area.
9191
The page area can be set through ''@page'' rules.
9292

9393
This specification introduces a way of overriding the size of the viewport
94-
provided by the user agent (UA). Because of this, we need to introduce the
95-
difference between the [=initial viewport=] and the [=layout viewport=].
94+
provided by the user agent (UA). Because of this, we need to define
95+
[=initial viewport=], [=layout viewport=] and [=visual viewport=].
9696

9797
<dl>
9898
<dt><dfn>initial viewport</dfn></dt>
9999
<dd>
100100
This refers to the viewport before any UA or author styles have
101101
overridden the viewport given by the window or viewing area of the UA.
102-
Note that the [=initial viewport=] size will change with the
103-
size of the window or viewing area.</dd>
102+
103+
Note: The [=initial viewport=] size will change with the size of the
104+
window or viewing area.</dd>
104105
<dt><dfn>layout viewport</dfn></dt>
105106
<dd>
106107
This is the viewport you get after processing the viewport
107108
<code>&lt;meta&gt;</code> tag.
108109
</dd>
110+
<dt><dfn>visual viewport</dfn></dt>
111+
<dd>
112+
This is the portion of the layout viewport that is currently visible,
113+
obtained by result of applying scale transform to its layout viewport.
114+
This transform is applied to the <a>canvas</a> of the <a>layout viewport</a>
115+
and does not affect its internal coordinate space. The magnitude of the
116+
scale transform is known as the <a>visual viewport</a>'s <dfn export>scale factor</dfn>.
117+
118+
Note: The [=visual viewport=] can be smaller than the [=layout viewport=].
119+
</dd>
109120
</dl>
110121

111-
ISSUE: Define visual viewport.
122+
Note: The scale transform of the [=visual viewport=] is often referred to as
123+
"pinch-zoom". Conceptually, this transform changes the size of the CSS
124+
<a>reference pixel</a> and changes the size of the layout viewport (inversally)
125+
proportionally so that it does not cause reflow of the page's contents.
112126

113127
When the [=layout viewport=] cannot fit inside the window or
114128
viewing area, either because the [=layout viewport=] is

cssom-view-1/Overview.bs

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -296,17 +296,8 @@ The <dfn>ending edges</dfn> of a particular set of edges of a box or element are
296296
<dd>The top and right edges.
297297
</dl>
298298

299-
The <dfn>visual viewport</dfn> is a kind of <a>viewport</a> whose <a>scrolling area</a> is another <a>viewport</a>,
300-
called the <dfn export>layout viewport</dfn>.
301-
302-
In addition to scrolling, the <a>visual viewport</a> may also apply a scale transform to its <a>layout viewport</a>.
303-
This transform is applied to the <a>canvas</a> of the <a>layout viewport</a> and does not affect its internal coordinate space.
304-
305-
Note: The scale transform of the visual viewport is often referred to as "pinch-zoom". Conceptually, this transform
306-
changes the size of the CSS <a>reference pixel</a> but changes the size of the layout viewport proportionally so that it
307-
does not cause reflow of the page's contents.
308-
309-
The magnitude of the scale transform is known as the <a>visual viewport</a>'s <dfn>scale factor</dfn>.
299+
The <a>visual viewport</a>'s <a>scrolling area</a> is another <a>viewport</a>,
300+
the <a>layout viewport</a>.
310301

311302
<style>
312303
@keyframes lvmove {

0 commit comments

Comments
 (0)