Transitions Sass / Compass

Est-il possible d'utiliser une Boussole ou SASS à la sortie de la suite de transition CSS qui sortira tous les différents fournisseurs préfixes:

-webkit-transition: all 0.3s ease-in-out;

quelqu'un Peut-il m'indiquer la bonne bibliothèque?

19
demandé sur lorem monkey 2013-01-13 10:30:20

3 réponses

Utiliser boussole' transition mixin:

@include transition(all 0.3s ease-in-out);
51
répondu Joseph Silber 2013-01-13 06:48:04

Mixin pour créer des animations en utilisant des transitions de propriétés simples ou "toutes"

@include transition(PROPERTY DURATION DELAY(OPT) TIMING-FUNCTION)
@mixin transition($transition) {
  -webkit-transition: $transition;
     -moz-transition: $transition;
      -ms-transition: $transition;
       -o-transition: $transition;
          transition: $transition;
}

Mixin pour créer des animations en utilisant des transitions de propriétés multiples

@include multi-transition("PROPERTY DURATION DELAY(OPT) TIMING-FUNCTION, PROPERTY DURATION DELAY(OPT) TIMING-FUNCTION")
@mixin multi-transition($transition) {
 -webkit-transition: #{$transition};
    -moz-transition: #{$transition};
     -ms-transition: #{$transition};
      -o-transition: #{$transition};
         transition: #{$transition};
}
6
répondu Muhammed 2014-04-08 23:25:46

SASS Mixin

@mixin transition($transition){
     -webkit-transition: $transition;
     -moz-transition: $transition;
     -o-transition: $transition;
     transition: $transition;
}

@include transition(all 0.3s ease-in-out);
0
répondu Sony Mathew 2016-11-25 10:21:14