diff --git a/css-nav-1/Overview.bs b/css-nav-1/Overview.bs index 51178496635..124cc8147f2 100644 --- a/css-nav-1/Overview.bs +++ b/css-nav-1/Overview.bs @@ -510,29 +510,6 @@ this only searches through the visible focusable areas of the nearest and the result will be null. - -
- The following code changes the behavior of spatial navigation - from scrolling when there is no focusable element visible, - to jumping to focusable elements even when they are not visible. - - 

-    document.addEventListener("navbeforescroll", function(e) {
-        var container = e.relatedTarget;
-        var areas = container.focusableAreas({ mode: "all" });
-
-        if (areas.length === 0) { return; }
-
-        e.preventDefault();
-        var t = e.target.spatialNavigationSearch({
-            dir: e.dir,
-            candidates: areas
-        });
-        t.focus();
-    });
-
-
-
The following code changes the behavior of spatial navigation so that when a scroll container would get focused, @@ -714,113 +691,6 @@ The navbeforefocus event occurs before spatial navigation changes t
-

-navbeforescroll

- -The navbeforescroll event occurs before spatial navigation triggers scrolling. - - - - - - - - -
Type - navbeforescroll -
Interface - {{NavigationEvent}} -
Bubbles - Yes -
Cancelable - Yes -
Attributes of the event -
-
{{NavigationEvent}}.{{NavigationEvent/relatedTarget}} -
The element that will be scrolled if the event is not canceled - -
{{NavigationEvent}}.{{NavigationEvent/dir}} -
The direction of the navigation as requested by the user -
-
- -
- This example shows the [[UI-EVENTS#event-order]] when pressing the ArrowDown - key in the situation like the following figure. - For the sake of keeping the description simple, - this example assumes a UA where spatial navigation is triggered using arrow keys. - -
- An image about navbeforescroll -
"Box 2" gains the focus and there isn't any candidate in a downward direction - in the scrollport.
-
- - - - - - - - - -
- Event type - Event target - relatedTarget - Notes -
1 - keydown - #box2 - N/A - MUST be a key which can activate spatial navigation, - such as the arrow keys, - otherwise spatial navigation is not triggered. -
2 - navbeforescroll - #box2 - #scrollContainer - Sent if #scrollContainer doesn't contain any candidate in the scrollport, - otherwise this would not be generated. -
- - After navbeforescroll is fired, pressing the ArrowDown key triggers scrolling - down the scrollbar like in the figure below: - -
- An image of the result about navnotarget -
The result of moving focus when there isn't any candidate in the scrollport.
-
- - This example uses the markup as follows: - 
-        #scrollContainer {
-            width: 700px;
-            height: 700px;
-            overflow-x: hidden;
-            overflow-y: auto;
-        }
-
-        .item {
-            width: 150px;
-            height: 110px;
-            background-color: blue;
-        }
-
-        .item:focus {
-            background-color: red;
-        }
-
- - 
-        <div id="scrollContainer">
-            <div id="box1" class="item" tabindex="0">Box 1</div>
-            <div id="box2" class="item" tabindex="0">Box 2</div>
-            <div id="box3" class="item" tabindex="0">Box 3</div>
-        </div>
-
-
-

navnotarget

@@ -1057,7 +927,7 @@ To run the spatial navigation steps in direction, do the f 1. Let searchOrigin be the DOM anchor of the currently focused area of a top-level browsing context. 2. If the spatial navigation starting point is not null and it is inside searchOrigin - then set searchOrigin to the spatial navigation starting point + then set searchOrigin to the spatial navigation starting point. 3. * If searchOrigin is an node, let eventTarget be searchOrigin @@ -1079,27 +949,15 @@ To run the spatial navigation steps in direction, do the f and with it's bubbles and cancelable attributes set to true, and return if the result is false 3. Run the focusing steps for bestCandidate and return - * Else if eventTarget can be manually scrolled: - 1. If navigation-override is enabled in the [=node document=] of eventTarget for the origin of the [=active document=] of the [=top-level browsing context=], then - fire an event named navbeforescroll at eventTarget using {{NavigationEvent}} - with its {{NavigationEvent/dir}} set to direction - and {{NavigationEvent/relatedTarget}} set to eventTarget - and with it's bubbles and cancelable attributes set to true, - and return if the result is false - 2. Directionally scroll the element eventTarget in direction and return. - * Else, fallback to the next step + * Else if eventTarget can be manually scrolled, directionally scroll the element + eventTarget in direction and return. + * Else, fallback to the next step. 6. Let container be the nearest ancestor of eventTarget that is a spatial navigation container. 7. Loop: Let candidates be the result of finding focusable areas within container, excluding searchOrigin 8. If candidates is empty: - * If container is a scroll container that can be manually scrolled: - 1. If navigation-override is enabled in the [=node document=] of eventTarget for the origin of the [=active document=] of the [=top-level browsing context=], then - fire an event named navbeforescroll at eventTarget using {{NavigationEvent}} - with its {{NavigationEvent/dir}} set to direction - and {{NavigationEvent/relatedTarget}} set to container - and with it's bubbles and cancelable attributes set to true, - and return if the result is false - 2. Directionally scroll the element container in direction and return. + * If container is a scroll container that can be manually scrolled, directionally scroll the element + container in direction and return. * Else, 1. If navigation-override is enabled in the [=node document=] of eventTarget for the origin of the [=active document=] of the [=top-level browsing context=], then fire an event named navnotarget at eventTarget using {{NavigationEvent}}