Skip to content

Commit 03067d2

Browse files
committed
[css-scroll-snap-2] rearranging interaction sections
1 parent 956df87 commit 03067d2

File tree

1 file changed

+35
-52
lines changed

1 file changed

+35
-52
lines changed

css-scroll-snap-2/Overview.bs

+35-52
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ The 'scroll-start' property {#scroll-start}
130130

131131
<pre class="propdef shorthand">
132132
Name: scroll-start
133-
Value: [ auto | start | end | center | <<length-percentage>> ]{1,2}
133+
Value: [ auto | start | end | center | left | right | top | bottom | <<length-percentage>> ]{1,2}
134134
</pre>
135135

136136
This property is a shorthand property that sets all of the scroll-start-* longhands in one declaration.
@@ -160,6 +160,36 @@ The 'scroll-start' property {#scroll-start}
160160
Equivalent to ''0%'', ''50%'', and ''100%'', respectively.
161161
</dl>
162162

163+
<h4 id="display-none-behavior">Interaction with ''display: none'' and initial creation</h4>
164+
Same behavior that animations follow with <a href="#first-layout">first layout</a>.
165+
166+
<h4 id="slow-page-load-behavior">Slow page loading or document streaming behavior</h4>
167+
TODO
168+
169+
<h4 id="fragment-navigation-behavior">Interaction with ''fragment navigation''</h4>
170+
TODO
171+
If the scrollport has a in-page '':target'' via a URL fragment or a previous scroll position, then ''scroll-start'' is unused. Existing target logic should go unchanged. This makes ''scroll-start'' a soft request in the scroll position resolution routines.
172+
173+
<h4 id="place-content-behavior">Interaction with ''place-content''</h4>
174+
TODO
175+
Side note: While ''place-content'' can make a scroller appear to start in the center
176+
or end, no browser supports it and it appears complicated to resolve.
177+
178+
<h4 id="find-in-page-behavior">Interaction with "find in page"</h4>
179+
TODO
180+
181+
<h4 id="scroll-snap-container-behavior">Interaction ''scroll-snap'' containers</h4>
182+
This effectively will layout and start scroll at the snapped child, thus negating / cancelling ''scroll-start''. ''scroll-start'' will only work if nothing else has effected the scroll position.
183+
184+
<h4 id="nested-scrollers">Nested scrollers with ''scroll-start''</h4>
185+
Should follow patterns that scroll snap has set.
186+
187+
<h4 id="toggling-display-none">Interaction when ''display'' is toggled</h4>
188+
Same behavior that animations follow with ''first layout''.
189+
190+
<h4 id="rtl">Interaction with RTL and LTR</h4>
191+
Logical properties are offered for length offsets that should be flow relative. Furthermore, the ''end'' and ''start'' keywords are always logical.
192+
163193
The 'scroll-start-target' property {#scroll-start-target}
164194
-------------------------------------------
165195

@@ -180,8 +210,8 @@ The 'scroll-start-target' property {#scroll-start-target}
180210
<dd>Element is not a ''scroll-start-target''.
181211
<dt><dfn>auto</dfn>
182212
<dd>Element is used to calculate the ''scroll-start'' position,
183-
taking into account ''scroll-padding''
184-
as if the element was a ''scroll-snap'' target.
213+
taking into account ''scroll-padding'' or ''scroll-margin'' ,
214+
same as a ''scroll-snap'' target.
185215
</dl>
186216

187217
Styling Snapped Items {#todo}
@@ -219,7 +249,7 @@ More specific options are defined as follows:
219249
Note: <a href="https://github.com/w3c/csswg-drafts/issues/6985#issuecomment-1049036401">Issue #6985</a><br>
220250
Need to figure out resolution of the initial frame.
221251

222-
Snap Events {#todo}
252+
Snap Events {#snap-events}
223253
===================
224254

225255
<!--
@@ -232,7 +262,7 @@ Snap Events {#todo}
232262
████████ ███ ████████ ██ ██ ██ ██████
233263
-->
234264

235-
{{snapChanged}} and {{snapChanging}} {#todo}
265+
{{snapChanged}} and {{snapChanging}} {#snapchanged-and-snapchanging}
236266
--------------------------------------------
237267

238268
CSS scroll snap points are often used as a mechanism to
@@ -256,53 +286,6 @@ Snap Events {#todo}
256286
<td>{{scroll!!event}}
257287
</table>
258288

259-
<!-- BIG TEXT: INTERACTIONS -->
260-
261-
Interactions with:
262-
==================
263-
264-
The next sections outline interactions with other specs and scroll position effecting scenarios.
265-
266-
''scroll-padding'' and ''scroll-margin''
267-
----------------------------------------
268-
269-
If the scrollport has a in-page '':target'' via a URL fragment or a previous scroll position, then ''scroll-start'' is unused. Existing target logic should go unchanged. This makes ''scroll-start'' a soft request in the scroll position resolution routines.
270-
271-
''fragment navigation''
272-
-----------------------
273-
274-
If the scrollport has a in-page '':target'' via a URL fragment or a previous scroll position, then ''scroll-start'' is unused. Existing target logic should go unchanged. This makes ''scroll-start'' a soft request in the scroll position resolution routines.
275-
276-
''scrollTo()'' options
277-
----------------------
278-
279-
TODO
280-
281-
a ''scroll-snap'' container with only 1 snap child
282-
--------------------------------------------------
283-
284-
This effectively will layout and start scroll at the snapped child, thus negating / cancelling ''scroll-start''. ''scroll-start'' will only work if nothing else has effected the scroll position.
285-
286-
nested scrollers
287-
----------------
288-
289-
Should follow patterns that scroll snap has set.
290-
291-
''display'' is toggled
292-
----------------------
293-
294-
Same behavior that animations follow with ''first layout''.
295-
296-
RTL/LTR
297-
-------
298-
299-
Logical properties are offered for length offsets that should be flow relative. Furthermore, the ''end'' and ''start'' keywords are always logical.
300-
301-
''place-content''
302-
-----------------
303-
304-
TODO
305-
306289
<!--
307290
██ ███████ ██ ██ ██████ ██ ██ ███ ██ ██ ████████ ██████
308291
██ ██ ██ ███ ██ ██ ██ ██ ██ ██ ██ ███ ██ ██ ██ ██ ██

0 commit comments

Comments
 (0)