4 ms·

A demo https://codepen.io/editor/phelm/pen/019e87f5-dfec-7372-9849-be4d0d8586f0 https://codepen.io/editor/phelm/pen/019e87f5-dfec-7372-9849-...

• frereubu 4mo ago
  There's me scrolling up and down and thinking "hey, it's not working!" But it's behind a flag on Firefox: https://caniuse.com/?search=view-timeline-name https://caniuse.com/?search=view-timeline-name
  • anssip 4mo ago
    Noticed the same thing. In Mac Safari it works without setting any flags.
  • werdnapk 4mo ago
    It's been behind a flag for ages. Maybe because of performance issues?
    • goodmythical 4mo ago
      Enabling (layout.css.scroll-driven-animations.enabled) and refreshing the codepen gives a "we crashed this to prevent a crash from an infinite loop" clicking to allow the infinite loops allowed me to see the animation. Fedora 44 Kernel: x86_64 Linux 7.0.10-201.fc44.x86_64 Firefox 151.0.2
  • WithinReason 4mo ago
    tried 4 browsers, didn't work in any of them
    • alpinisme 4mo ago
      FWIW it works on iPhone safari
      • abejfehr 4mo ago
        I don’t think it did for me. Are you on iOS 26?
        • alpinisme 4mo ago
          Ahh, yes I am. 26.5
      • layer8 4mo ago
        Only on iOS 26.
      • deckar01 4mo ago
        But it jumps around and flickers pretty bad. Chrome’s own demos in the docs don’t work at all. https://developer.chrome.com/docs/css-ui/scroll-driven-animations https://developer.chrome.com/docs/css-ui/scroll-driven-anima... Edit: Their reference works and has some really nice demos. Must be an iframe problem. https://scroll-driven-animations.style/#demos https://scroll-driven-animations.style/#demos
  • wnevets 4mo ago
    Doesnt work on any browser for me
    • deleted 4mo ago
      [deleted]
  • frereubu 4mo ago
    For people saying it's not working in any browser - do you have some kind of reduced motion preference setting turned on? I can imagine that would have an effect on something like this and it's definitely working in Chrome for me.
    • cj 4mo ago
      Yes... there's a media query in the codepen disabling animation for people with reduced motion enabled.
• account42 4mo ago
  What an age where we need a pile of javascript as well as a bot check to demo a simple CSS trick.
  • zamadatix 4mo ago
    The JS and bot check are for making additional functionality, beyond just showing the example, work easily. I.e. editing and sharing edits from a browser. If all you want is a static example, feel free to make it without these things.
• Mashimo 4mo ago
  Only worked for me on mobile (vivaldi android) not on vivaldi / chrome / edge on Desktop.