Skip to content

[css-overflow-5] Treat the last scroll target as active #11320

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Dec 6, 2024
Merged

[css-overflow-5] Treat the last scroll target as active #11320

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ccebfb3
[css-overflow-5] Treat the last scroll target as active
flackr Dec 3, 2024
a92e3b6
Merge branch 'main' into scroll-target
flackr Dec 5, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
85 changes: 57 additions & 28 deletions css-overflow-5/Overview.bs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -154,6 +154,28 @@ its content will be integrated into this specification,
which will then replace it.
Until then, this specification only contains additions and extensions to level 4.

<h2 id="overflow-concepts">
Overflow Concepts and Terminology</h2>

Issue: Copy [[css-overflow-3#overflow-concepts|Level 3 content]] when final.

<h3 id="scrolling">Scrolling overflow</h3>

The following is added to the concepts in scrolling overflow:

Every [=scroll container=] maintains a <dfn export>current scroll target</dfn>.
It is initially <code>null</code>,
and is reset to <code>null</code> after any scrolling operations in that [=scroll container=]
initiated by the user,
or any script initiated operations that do not have a target,
or when the target is removed from the document.
Scrolling operations in the [=scroll container=] with a target Element or PseudoElement,
set the [=current scroll target=] to that target Element or PseudoElement.

Issue: Setting the current scroll target should be defined in how to <a>scroll a target into view</a>.

Issue: Use the current scroll target as an <a>anchor priority candidate</a> for scroll anchoring.

<h2 id="scroll-navigation">
Scroll navigation controls</h2>

Expand Down Expand Up @@ -304,34 +326,41 @@ Selecting The Active Scroll Marker: the '':target-current'' pseudo-class</h4>
1. Let <var>scroller</var> be |active|.
1. Let <var>targets</var> be the set of the [=scroll target=] elements whose nearest ancestor [=scroll container=] is |scroller|
and the [=scroll container=] elements which contain [=scroll target=] elements targeted by the [=scroll marker group=] whose nearest ancestor [=scroll container=] is |scroller|.
1. Let <var>primary</var> be the primary scrolling axis, assumed to be the block direction of the container's writing-mode.
1. Let <var>secondary</var> be the scrolling axis perpendicular to primary.
1. Let <var>position</var> be the 'eventual scroll position' considering ongoing scrolling operations.
1. For each <var>axis</var> of |primary|, followed by |secondary|:
1. Let <var>scrollport size</var> be the client size of |scroller| in the dimension |axis|.
1. For each |target| in |targets|, <a>determine the scroll-into-view position</a> of |target| in |axis|, storing this as the associated |target position| of |target|.
1. Let <var>scroll size</var> be the length of the <a>scrollable overflow area</a> of the |scroller| in the dimension |axis|.
1. Let <var>scroll range</var> be <code>|scroll size| - |scrollport size|</code>.
1. If |scroll range| is greater than 0, redistribute unreachable target positions:
1. Let <var>distribute range</var> be <code>min(1/8 * |scrollport size|, |scroll range| / 2)</code>.
1. Let <var>before targets</var> be all |targets| whose associated |target position| is less than <code>|distribute range|</code>.
1. Let <var>minimum position</var> be the minimum |target position| of |before targets|.
1. Update the associated |target position| of each target in |before targets| to
<code>(|target position| - |minimum position|) / (|distribute range| - |minimum position|) * |distribute range|</code>.
1. Let <var>after targets</var> be all |targets| whose associated |target position| is greater than <code>|scroll range| - |distribute range|</code>.
1. Let <var>maximum position</var> be the maximum |target position| of |after targets|.
1. Update the associated |target position| of each target in |after targets| to
<code>(|target position| - (|scroll range| - |distribute range|)) / (|maximum position| - (|scroll range| - |distribute range|)) * |distribute range| + (|scroll range| - |distribute range|)</code>.
1. Let |selected position| be the largest |target position|
where |target position| is equal to or before |position| in the |axis|,
or whose nearest smaller |target position| < |position| - |scrollport size| / 2 and whose |target position| < |position| + |scrollport size| / 2.

1. : If there is no such position,
::
Set the |selected position| to the first one.

1. Let |active| be the all of the |targets| whose associated |target position| is |selected position|.
1. Let |active| be the first item in |active| if it has more than one potential target.
1. : If |scroller| has a non-null [=current scroll target=]
::
Let active be the first item in |targets| encountered by a reverse tree order walk starting from the [=current scroll target=],
or the first item in tree order in |targets| if no target is found in the previous walk.

: Otherwise,
::

1. Let <var>primary</var> be the primary scrolling axis, assumed to be the block direction of the container's writing-mode.
1. Let <var>secondary</var> be the scrolling axis perpendicular to primary.
1. Let <var>position</var> be the 'eventual scroll position' considering ongoing scrolling operations.
1. For each <var>axis</var> of |primary|, followed by |secondary|:
1. Let <var>scrollport size</var> be the client size of |scroller| in the dimension |axis|.
1. For each |target| in |targets|, <a>determine the scroll-into-view position</a> of |target| in |axis|, storing this as the associated |target position| of |target|.
1. Let <var>scroll size</var> be the length of the <a>scrollable overflow area</a> of the |scroller| in the dimension |axis|.
1. Let <var>scroll range</var> be <code>|scroll size| - |scrollport size|</code>.
1. If |scroll range| is greater than 0, redistribute unreachable target positions:
1. Let <var>distribute range</var> be <code>min(1/8 * |scrollport size|, |scroll range| / 2)</code>.
1. Let <var>before targets</var> be all |targets| whose associated |target position| is less than <code>|distribute range|</code>.
1. Let <var>minimum position</var> be the minimum |target position| of |before targets|.
1. Update the associated |target position| of each target in |before targets| to
<code>(|target position| - |minimum position|) / (|distribute range| - |minimum position|) * |distribute range|</code>.
1. Let <var>after targets</var> be all |targets| whose associated |target position| is greater than <code>|scroll range| - |distribute range|</code>.
1. Let <var>maximum position</var> be the maximum |target position| of |after targets|.
1. Update the associated |target position| of each target in |after targets| to
<code>(|target position| - (|scroll range| - |distribute range|)) / (|maximum position| - (|scroll range| - |distribute range|)) * |distribute range| + (|scroll range| - |distribute range|)</code>.
1. Let |selected position| be the largest |target position|
where |target position| is equal to or before |position| in the |axis|,
or whose nearest smaller |target position| < |position| - |scrollport size| / 2 and whose |target position| < |position| + |scrollport size| / 2.
1. : If there is no such position,
::
Set the |selected position| to the first one.

1. Let |active| be the all of the |targets| whose associated |target position| is |selected position|.
1. Let |active| be the first item in |active| if it has more than one potential target.

1. Let |selected marker| be the [=scroll marker=] associated with |active|.
If multiple [=scroll marker=] elements are associated with |active|,
Expand Down