可以在sass中转换translateXY mixin函数

时间:2018-11-13 12:49:09

标签: css sass

你好,我正在为mixX和translateY使用混合功能,并为值X和Y创建仅一个可能或不可能的函数,请帮助Adavance。

之所以可以使用Example-1,是因为只有一个值可以通过,而另一个示例是possilbe,或者在SASS中只有一个函数一次不能传递两个值的任何其他想法?

示例1

@mixin translateX($value) {
    -webkit-transform: translateX($value);
    -moz-transform: translateX($value);
    -ms-transform: translateX($value);
    transform: translateX($value);
}

示例2

@mixin translateXY($value1, $value2) {
    -webkit-transform: translateXY($value1, $value2);
    -moz-transform: translateXY($value1, $value2);
    -ms-transform: translateXY($value1, $value2);
    transform: translateXY($value1, $value2);
}

1 个答案:

答案 0 :(得分:1)

按如下方式使用sass:

@include中设置translate的参数:@include translateXY(30%,50%);

@mixin中,使用translate而不是translateXY

See fiddle

@mixin translateXY($value1, $value2) {
  .try{
    -webkit-transform: translate($value1, $value2);
    -moz-transform: translate($value1, $value2);
    -ms-transform: translate($value1, $value2);
    transform: translate($value1, $value2);
    }
}

@include translateXY(30%,50%);