Skip to content

Instantly share code, notes, and snippets.

@joebailey26

joebailey26/scroll.html

Last active January 14, 2021 22:27
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save joebailey26/04220c87afeacc2a47670a90565fc12b to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save joebailey26/04220c87afeacc2a47670a90565fc12b to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. Joe Bailey renamed this gist Jan 14, 2021. 1 changed file with 6 additions and 1 deletion.
    7 changes: 6 additions & 1 deletion style.css → scroll.html
    View file
    Original file line number Diff line number Diff line change
    @@ -1,8 +1,13 @@
    <style>
    :root:focus-within {
    scroll-behavior: smooth;
    }
    @media screen and (prefers-reduced-motion: reduce) {
    :root:focus-within {
    scroll-behavior: auto;
    }
    }
    }
    </style>
    <a href="#scrolled">Scroll me</a>
    <div tabindex="-1" id="scrolled">
    </div>
  2. Joe Bailey created this gist Jan 14, 2021.
    8 changes: 8 additions & 0 deletions style.css
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,8 @@
    :root:focus-within {
    scroll-behavior: smooth;
    }
    @media screen and (prefers-reduced-motion: reduce) {
    :root:focus-within {
    scroll-behavior: auto;
    }
    }