Set a CSS3 transition to none

后端 未结 3 1789
面向向阳花
面向向阳花 2020-12-28 14:00

How would I make it so a CSS transition doesn\'t work inside a media-query, or in any other case? For example:

@media (min-width: 200px) {
    element {
             


        
3条回答
  •  -上瘾入骨i
    2020-12-28 14:56

    Even better than setting transition-property to none is setting transition-duration to 0s.

    This is the cross-browser code:

    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
    

    Why is this better? Because, by default, standards-compliant browsers (such as Firefox) set transition-property to all for each element. They also set transition-duration to 0s. Thus, by setting transition-duration to 0s, you are most closely matching how the browser defines an element without a transition.

    Setting the transition-duration to the default 0s renders the transition-property irrelevant.

提交回复
热议问题