How to disable animation on components



  • Hi!

    How can I disable select’s q-popover animation? with lots of options it feels sluggish on mobile.

    Thanks!



  • The animate class is hard coded into the component source, but you could override the CSS for the popover with this line:

    .q-popover.animate-scale {
        animation: none;
    }
    


  • Hi @a47ae, that worked perfectly! I’ll do the same for other animations, thanks!



  • Glad it worked, but keep in mind that in future versions the animate-scaleclass name could change so keep an eye on this.



  • @rstoenescu could we have a prop for that in all animated components please?
    e.g. adding no-animation to a component would do that css override (or anything else appropriate internally to forfeit the animation effect)

    or maybe animation="none" if you plan on later allowing custom animations to be set through that same prop ( /wink /wink /nudge /nudge )


Log in to reply
 

Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.