Skip to content

Commit 13d0bf2

Browse files
committed
[css-scroll-snap] Fix snap wording.
1 parent 9005445 commit 13d0bf2

1 file changed

Lines changed: 34 additions & 30 deletions

File tree

css-scroll-snap/Overview.bs

Lines changed: 34 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -325,43 +325,45 @@ Scroll Snapping Rules: the 'scroll-snap-type' property {#snap-type}
325325
</div>
326326

327327
The axis values specifies what axis(es) are affected by <a>snap positions</a>,
328-
and which <a>snapping behavior</a> the <a>scroll container</a> uses.
328+
and whether <a>snap positions</a> are evaluated independently per axis,
329+
or together as a 2D point.
329330
Values are defined as follows:
330331

331332
<dl dfn-type=value dfn-for="scroll-snap-type">
332333
<dt><dfn>x</dfn>
333334
<dd>
334-
The <a>scroll container</a> does <a>axis snapping</a> in its horizontal axis only.
335+
The <a>scroll container</a> <a>axis-snaps</a> to <a>snap positions</a> in its horizontal axis only.
335336

336337
<dt><dfn>y</dfn>
337338
<dd>
338-
The <a>scroll container</a> does <a>axis snapping</a> in its vertical axis only.
339+
The <a>scroll container</a> <a>axis-snaps</a> to <a>snap positions</a> in its vertical axis only.
339340

340341
<dt><dfn>block</dfn>
341342
<dd>
342-
The <a>scroll container</a> does <a>axis snapping</a> in its block axis only.
343+
The <a>scroll container</a> <a>axis-snaps</a> to <a>snap positions</a> in its block axis only.
343344

344345
<dt><dfn>inline</dfn>
345346
<dd>
346-
The <a>scroll container</a> does <a>axis snapping</a> in its inline axis only.
347+
The <a>scroll container</a> <a>axis-snaps</a> to <a>snap positions</a> in its inline axis only.
347348

348349
<dt><dfn>both</dfn>
349350
<dd>
350-
The <a>scroll container</a> does <a>axis snapping</a> in both of its axises independently.
351+
The <a>scroll container</a> <a>axis-snaps</a> to <a>snap positions</a> in both of its axises independently
352+
(potentially snapping to different elements in each axis).
351353

352354
<dt><dfn>point</dfn>
353355
<dd>
354-
The <a>scroll container</a> does <a>point snapping</a>.
356+
The <a>scroll container</a> <a>point-snaps</a> to <a>snap positions</a> in both axises simultaneously,
357+
treating each element’s <a>snap position</a> as a single 2D position
358+
(rather than potentially snapping to different elements in each axis).
355359
</dl>
356360

357361
If no axis value is specified, then the axis is automatically computed:
358362

359363
* If the <a>scroll container</a> is only scrollable in one axis
360364
(only one axis has its 'overflow' set to ''overflow/auto'' or ''overflow/scroll'')
361-
the scrollable axis is chosen.
362-
* Otherwise, the <a>scroll container’s</a> <a>block axis</a> is chosen.
363-
364-
In either case, the <a>scroll container</a> does <a>axis snapping</a>.
365+
it <a>axis-snaps</a> in the scrollable axis only.
366+
* Otherwise, it <a>axis-snaps</a> in its <a>block axis</a> only.
365367

366368
<!--
367369
████████ ███ ████████ ████████ ████ ██ ██ ██████
@@ -554,7 +556,7 @@ Scroll Snapping Alignment: the 'scroll-snap-align' property {#scroll-snap-alignm
554556
Issue: It's not 100% clear if this value is necessary, given handling for <a href="#snap-overflow">over-large elements</a>.
555557
</dl>
556558

557-
If the element's <a>scroll container</a> is <a>point snapping</a>,
559+
If the element's <a>scroll container</a> is <a>point-snapping</a>,
558560
and this property does not specify a single valid <a>snap position</a> in both axises
559561
(that is, it contains ''scroll-snap-align/none'' or ''edges''),
560562
the element does not contribute any <a>snap positions</a> at all.
@@ -780,33 +782,32 @@ Types of Scrolling Methods {#scroll-types}
780782
██████ ████████ █████████ ████████
781783
-->
782784

783-
Axis vs Point Snapping {#snap-dimensions}
785+
Axis vs Point-Snapping {#snap-dimensions}
784786
-----------------------------------------
785787

786788
There are two distinct <dfn lt="snap behavior|snapping behavior">snapping behaviors</dfn> that a <a>scroll container</a> might engage in:
787789

788-
: <dfn export local-lt="axis" lt="axis snapping|axis-snapping">axis snapping</dfn>
789-
:: If a <a>scroll container</a> is engaging in <a>axis snapping</a>,
790+
: <dfn export local-lt="axis" lt="axis-snapping|axis-snap">axis-snapping</dfn>
791+
:: If a <a>scroll container</a> is <a>axis-snapping</a>,
790792
its descendants indicate a desired scroll position
791-
in one axis of the <a>scroll container</a> only,
792-
with no preference for what the other axis's scroll position should be.
793+
in each axis of the <a>scroll container</a> independently,
794+
with no dependent preference for what the other axis's scroll position should be.
793795

794-
Note: This is the “default” type of <a>snap position</a>
795-
that most elements will want to use,
796-
and so the ''scroll-snap-align'' property intentionally makes it the simplest to specify.
796+
Note: This is the “default” type of <a>snap behavior</a>
797+
that most <a>scroll containers</a> will want to use,
798+
and so the ''scroll-snap-type'' property intentionally defaults to it.
797799

798-
Note: An element can declare two <a>snap positions</a>,
800+
Note: An element in an <a>axis-snapping</a> <a>scroll container</a>
801+
can declare two <a>snap positions</a>,
799802
one in each axis.
800-
If the <a>scroll container</a> is <a>axis snapping</a>,
801-
these represent two independent <a>snap position</a> preferences.
802803
If one of the element's <a>snap positions</a> is chosen in one axis,
803804
this has no bearing on the other dimension's <a>snap position</a>--
804805
it might be chosen,
805806
or a different element's <a>snap position</a> might be chosen for that axis,
806807
or that axis might not snap at all.
807808

808-
: <dfn export local-lt="point" lt="point snapping|point-snapping">point snapping</dfn>
809-
:: If a <a>scroll container</a> is engaging in <a>point snapping</a>,
809+
: <dfn export local-lt="point" lt="point-snapping|point-snap">point-snapping</dfn>
810+
:: If a <a>scroll container</a> is <a>point-snapping</a>,
810811
its descendants indicate a desired scroll position
811812
in both axises of the <a>scroll container</a> simultaneously--
812813
in other words,
@@ -847,17 +848,20 @@ Choosing Snap Positions {#choosing}
847848
and the final snapped scroll position,
848849
subject to the additional constraints listed in this section.
849850

850-
* <a>Point snapping</a> is all-or-nothing;
851-
if one <a>snap position</a> of an element is chosen to align to,
851+
* <a>Point-snapping</a> is all-or-nothing;
852+
if the <a>snap position</a> of an element is chosen to align to,
852853
the <a>scroll container</a> must set its scroll position
853854
according to the element's <a>snap positions</a> in <em>both</em> axises;
854855
the <a>scroll container</a> <em>must not</em> “partially align” to the element
855856
by taking its <a>snap position</a> in one axis
856857
and aligning the other axis according to something else.
857858

858-
* If a scroll is <a>axis-locked</a> and the <a>scroll container</a> is <a>axis snapping</a>,
859-
any <a>snap positions</a> in the other axis should be ignored;
860-
if the <a>scroll container</a> is <a>point snapping</a>,
859+
* If a scroll is <a>axis-locked</a> and the <a>scroll container</a> is <a>axis-snapping</a>,
860+
any <a>snap positions</a> in the other axis should be ignored
861+
during the scroll.
862+
(However, <a>snap positions</a> in the other axis can still effect the final scroll position.)
863+
864+
If a scroll is <a>axis-locked</a> and the <a>scroll container</a> is <a>point-snapping</a>,
861865
<a>snap positions</a> should be penalized in the selection process
862866
according to the amount of other-axis scrolling they would cause.
863867

0 commit comments

Comments
 (0)