<html>
    <head>
      <base href="https://bugs.webkit.org/" />
    </head>
    <body><table border="1" cellspacing="0" cellpadding="8">
        <tr>
          <th>Bug ID</th>
          <td><a class="bz_bug_link 
          bz_status_NEW "
   title="NEW - Scroll-Snap together with box-shadow on hover...jumps back to top of window"
   href="https://bugs.webkit.org/show_bug.cgi?id=148798">148798</a>
          </td>
        </tr>

        <tr>
          <th>Summary</th>
          <td>Scroll-Snap together with box-shadow on hover...jumps back to top of window
          </td>
        </tr>

        <tr>
          <th>Classification</th>
          <td>Unclassified
          </td>
        </tr>

        <tr>
          <th>Product</th>
          <td>WebKit
          </td>
        </tr>

        <tr>
          <th>Version</th>
          <td>WebKit Nightly Build
          </td>
        </tr>

        <tr>
          <th>Hardware</th>
          <td>Macintosh
          </td>
        </tr>

        <tr>
          <th>OS</th>
          <td>Mac OS X 10.10
          </td>
        </tr>

        <tr>
          <th>Status</th>
          <td>NEW
          </td>
        </tr>

        <tr>
          <th>Severity</th>
          <td>Normal
          </td>
        </tr>

        <tr>
          <th>Priority</th>
          <td>P2
          </td>
        </tr>

        <tr>
          <th>Component</th>
          <td>CSS
          </td>
        </tr>

        <tr>
          <th>Assignee</th>
          <td>webkit-unassigned&#64;lists.webkit.org
          </td>
        </tr>

        <tr>
          <th>Reporter</th>
          <td>lveith&#64;t-online.de
          </td>
        </tr></table>
      <p>
        <div>
        <pre>Created <span class=""><a href="attachment.cgi?id=260589" name="attach_260589" title="scroll with mouse on red-element shows bug, on green element did not.">attachment 260589</a> <a href="attachment.cgi?id=260589&amp;action=edit" title="scroll with mouse on red-element shows bug, on green element did not.">[details]</a></span>
scroll with mouse on red-element shows bug, on green element did not.

Use Scroll-Snap together with a extra box-shadow by hover a Scroll-Line-Element, shows a bug.

The Bug is, it always jumps/returns to Top of Window,
when your scrolling begins with mouse-position on any of that hover-Elements
and ends on any of that hover-Elements
and mouse move out of that hover-Element (after that it jumps back to Top of Window).

In Attachment, see document &quot;testScrollSnap.html&quot;.
To reproduce the Bug by my attached document,
move your mouse-cursor on the first left-side red-hover-element(01),
than scroll down with two fingers on your touchpad.
After your scroll-down ends, your mouse is still on another red-hover-element, than move your cursor to right with one finger (out of that hover-element).
Now you see the bug, it jumps back to Top of Window.
This only happens when you scroll on left side red elements.
It do not happen when you scroll on right side green elements or any other mouse position outside the red-elements.

I only can reproduce the bug when i use a css box-shadow in the hover-effect.
Making a hover-effect with the css outline or &quot;cursor: pointer&quot; did NOT had this Bug-Effekt &quot;jump back to top of window&quot;.</pre>
        </div>
      </p>
      <hr>
      <span>You are receiving this mail because:</span>
      
      <ul>
          <li>You are the assignee for the bug.</li>
      </ul>
    </body>
</html>