@@ -82,7 +82,6 @@ Use Cases {#use-cases}
82
82
}
83
83
li {
84
84
scroll-snap-align: edges;
85
- scroll-snap-scope: finite;
86
85
}
87
86
</pre>
88
87
@@ -95,7 +94,6 @@ Use Cases {#use-cases}
95
94
}
96
95
.city {
97
96
scroll-snap-align: center;
98
- scroll-snap-scope: finite;
99
97
}
100
98
</pre>
101
99
</div>
@@ -190,10 +188,12 @@ On the children:
190
188
<td> n/a
191
189
<td> ''scroll-snap-area: [ border-box | margin-box ] || <<length>>{1,4}''
192
190
<td> High priority
191
+ <!--
193
192
<tr>
194
193
<td> n/a
195
194
<td> ''scroll-snap-scope: infinite | finite''
196
195
<td> Only ''finite'' is really necessary to handle all use cases, however UAs might want ''infinite'' as the initial value for performance reasons.
196
+ -->
197
197
</table>
198
198
199
199
Element-based Snapping {#element}
@@ -298,6 +298,69 @@ Scroll Snapping Alignment: the 'scroll-snap-align' property {#scroll-snap-align}
298
298
Issue: Think about how mandatory/finite would work when there's nothing within range to snap to.
299
299
-->
300
300
301
+
302
+ Scope of Snapping Influence {#scope}
303
+ ===========================
304
+
305
+ Issue: Current spec doesn't define how to select which snap-point to snap to.
306
+ See <a href="https://lists.w3.org/Archives/Public/www-style/2015Jul/0325.html">https://lists.w3.org/Archives/Public/www-style/2015Jul/0325.html</a>
307
+ for a proposal to ignore snap positions far outside the viewport.
308
+
309
+ Issue: UAs should be encouraged to ignore snap positions that require scrolling in two dimensions
310
+ when a one-dimensional scroll is triggered.
311
+
312
+ Issue: Define that snap-point selection is based on the final scroll position that the scroll physics would land the scroller in after a fling.
313
+
314
+ <!--
315
+ Scoping Snaplines to Visible Objects: the 'scroll-snap-scope' property {#scroll-snap-scope}
316
+ ---------------------------
317
+
318
+ <pre class="propdef">
319
+ Name : scroll-snap-scope
320
+ Value : infinite | finite
321
+ Initial : infinite
322
+ Applies to : all elements
323
+ Inherited : no
324
+ Computed value : as specified
325
+ Animatable : no
326
+ Media : visual
327
+ </pre>
328
+
329
+ When ''finite'' snapping is enabled,
330
+ the "gravitational field" of a snap alignment is two-dimensional:
331
+ distance to the snap position is calculated for both dimensions at once.
332
+
333
+ In other words, if the snapping radius of influence is <var> r</var> ,
334
+ in infinite snapping the box snaps along the y axis
335
+ whenever it is within <var> r</var> of its snapped y position,
336
+ regardless of its x position.
337
+ But in finite snapping,
338
+ the box snaps along the y axis
339
+ whenever it is within <var> r</var> of its snapped position
340
+ in both dimensions.
341
+
342
+ <div class="example">
343
+ For example, a small box is snapped to the center of the viewport.
344
+ It only snaps whenever it is < <var> r</var> distance in any direction
345
+ from its snap position in both dimensions.
346
+ In other words, it snaps whenever sqrt(<var> d<sub> x</sub></var><sup> 2</sup> + <var> d<sub> y</sub></var><sup> 2</sup> ) ≤ <var> r</var>
347
+ for <var> d<sub> x</sub></var> ,<var> d<sub> y</sub></var> as distance to the snapped position in the x and y dimensions, respectively.
348
+ </div>
349
+
350
+ <div class="example">
351
+ As another example, a small box is snapped to the edges of the viewport.
352
+ It only snaps whenever matching edges are within <var> r</var> of the respective viewport edges,
353
+ so e.g. whenever its top edge approaches the top of the viewport,
354
+ or its left edge approaches the left of the viewport;
355
+ but there is no snapping effect if those edges are > <var> r</var> outside the viewport.
356
+ </div>
357
+
358
+ Issue: This feature can be safely deferred to a future level, if necessary.
359
+ Alternately it can be dropped and ''finite'' snapping can be the default.
360
+ (We can't think of a use case for the infinite snapping model,
361
+ except perhaps UA performance.)
362
+ -->
363
+
301
364
Group-based Snapping {#group}
302
365
========================
303
366
0 commit comments