[Webkit-unassigned] [Bug 266408] fixed background-attachments break scrolling inertia when scrolling element is not on the body

Thu Dec 14 06:22:46 PST 2023

https://bugs.webkit.org/show_bug.cgi?id=266408

--- Comment #1 from Arthur Detroux <ard at odoo.com> ---
Comment on attachment 469037
  --> https://bugs.webkit.org/attachment.cgi?id=469037
HTML which has the bug

><!DOCTYPE html>
><html>
>    <head>
>        <title>Safari Scroll Bug</title>
>        <style>
>            #wrap {
>                width: 100%;
>                height: 100%;
>                overflow: auto;
>                position: relative;
>                display: flex;
>                flex-flow: column nowrap;
>                margin: 0;
>                padding: 0;
>            }
>            #wrap > * {
>                flex: 0 0 auto;
>            }
>            #wrap > main {
>                flex: 1 0 auto;
>            }
>            section {
>                    display: block;
>                    width: 100%;
>                    min-height: 55vh;
>                    margin: 3px;
>                    position: relative;
>            }
>            section:nth-child(odd) {
>                background-color: blue;
>            }
>            section:nth-child(even) {
>                background-color: red;
>            }
>            section.parallax {
>                background-color: transparent;
>            }
>            .bg-fixed {
>                position: absolute;
>                top: 0;
>                bottom: 0;
>                left: 0;
>                right: 0;
>                overflow: hidden;
>                background-image: url("./cubes.jpg");
>                background-attachment: fixed;
>                background-size: cover;
>            }
>            html, body {
>                margin: 0;
>                overflow: hidden;
>                position: relative;
>                width: 100%;
>                height: 100%;
>                padding: 0;
>            }
>        </style>
>    </head>
>    <body>
>        <div id="wrap">
>            <main>
>                <div>
>                    <section class="parallax">
>                        <span class="bg-fixed"></span>
>                        <p>Content</p>
>                    </section>
>                    <section></section>
>                    <section></section>
>                    <section></section>
>                    <section></section>
>                </div>
>            </main>
>        </div>
>    </body>
></html>

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20231214/a36a48df/attachment-0001.htm>