Jump to main content

Nicolas Hoizey

  • articles
  • billets
  • links
  • notes
  • talks
  • archives
  • about

Note from 7 April 2023

  • Nicolas Hoizey
  • 7 April 2023
  • animation, CSS
  • 4 reactions

Chrome 113 beta adds support for @​media (update: slow) (Firefox already has it), great to remove some animations.

But can we @​supports a @​media to use it only if supported? I don't think so.

How do you use new @​media features progressively?

4 reactions

1 like

  1. Omstero avatar

3 replies

  1. HTeuMeuLeu avatar HTeuMeuLeu
    @nhoizey Si un bloc @media n'est pas reconnu, il est simplement ignoré, non ? Donc par défaut, c'est progressif.
    • 7 April 2023, 12:50
    • Source
  2. Nicolas Hoizey avatar Nicolas Hoizey
    @HTeuMeuLeu je peux déclarer une animation et l'annuler avec `@​media { update: slow }`, mais elle sera lue sur des liseuses qui ne le supportent pas encore.Je peux ne mettre l'animation que sur les `@​media { update: fast }`, mais les anciens navigateurs n'auront pas l'animation.Du coup j’hésite.Avec en plus la combinaison avec `@​media (prefers-reduced-motion: no-preference)`…
    • 7 April 2023, 12:58
    • Source
  3. Zach Leatherman :11ty: avatar Zach Leatherman :11ty:
    @nhoizey can `@media not` help here?https://developer.mozilla.org/en-US/docs/Web/CSS/@media#logical_operators
    @media - CSS: Cascading Style Sheets | MDN
    • 7 April 2023, 13:37
    • Source
  • Older: Note from 3 April 2023
  • Newer: Note from 7 April 2023

Related contents with similar topics

  1. screenshot of View transitions: Handling aspect ratio changes

    Jake Archibald avatar Jake Archibald

    View transitions: Handling aspect ratio changes

    • Nicolas Hoizey
    • 26 March 2024
    • View Transitions, CSS, animation
    • 8 reactions

    When folks ask me for help with view transition animations that "don't quite look right", it's usually because the content changes aspect ratio. Here's…

  2. screenshot of Complex MPA View Transitions

    Tyler Gaw avatar Tyler Gaw

    Complex MPA View Transitions

    • Nicolas Hoizey
    • 18 November 2023
    • View Transitions, CSS, animation
    • 4 reactions

    Worth mentioning again that this is just CSS with a touch of HTML. Also worth pointing out that very little of this is specific to CSS view transitions.…

  3. screenshot of Synchronize videos, 3D-models, etc. to Scroll-Driven Animations

    Bramus Van Damme avatar Bramus Van Damme

    Synchronize videos, 3D-models, etc. to Scroll-Driven Animations

    • Nicolas Hoizey
    • 24 June 2023
    • CSS, animation, scroll
    • 10 reactions

    With Scroll-Driven Animations it’s really easy to animate elements as they enter/exit/whatever. But what if you want to sync a video to that? Or maybe…

  4. screenshot of Ten tips for better CSS transitions and animations

    Josh Collinsworth avatar Josh Collinsworth

    Ten tips for better CSS transitions and animations

    • Nicolas Hoizey
    • 21 March 2023
    • CSS, animation
    • 7 reactions

    users may not realize what it is about the transitions or animations on our websites and apps, but they can keenly spot the difference between good…

  5. screenshot of Enhancing User Experience With CSS Animations

    Stéphanie Walter

    Enhancing User Experience With CSS Animations

    • Nicolas Hoizey
    • 26 August 2020
    • CSS, animation, transition, UX

    Another amazing resource from Stéphanie, a detailed transcript of a talk she gave for Shift Remote. With CSS and JS progress, implementing animations…

If you want to share an error or suggest an enhancement of this content, please edit the source on GitHub.

© Nicolas Hoizey

Built with Eleventy