javascript - SCSSでのJavascript式

Question

SCSSファイルに次のような@forループがあります。

@for $i from 1 through 12 {
    .cell:nth-child(#{$i}) {
        … //some code here
    }
}

正常に動作します。Math.sin()しかし、たとえば次のようなJavaScript式を使用していくつかのプロパティを計算する必要があります。

@for $i from 1 through 12 {
    .cell:nth-child(#{$i}) {
        top: Math.sin(90) * 150 * -1;
        left: Math.cos(90) * 150;
    }
}

SCSSコンパイラでエラーを取得します。JavaScript式を使用する方法はありますか、それとも悪用ですか？

score 2 · Accepted Answer

コアとなるSassの計算はかなり単純ですが、Compassには、関数を含む多数のヘルパーが付属しています。コンパスを設定したら、次のことができます。sin()cos()

@for $i from 1 through 12 {
    .cell:nth-child(#{$i}) {
        top: sin(90) * 150 * -1;
        left: cos(90) * 150;
    }
}

1 に答える 1