相关疑难解决方法(0)

如何迭代关键帧百分比减少CSS

我读过Less#loopsLess#functions docs.但我无法弄清楚如何应用percentage函数或类似的方法来逐步循环百分比而不使用这样的函数.

当我计算它时,如同在另一篇文章中 指出的那样width: percentage(140/620);,它在循环中运行,但在尝试使用变量循环时则不行.

在2014年@pixelass建议使用外部更容易循环,但我不想使用外部库.

我试图循环(甚至不编译):

.loop (@n, @index: 0) when (@index < @n) {
     percentage(@index * (100/@n)){ // This line is messing up my day.
         // code
     }
     .loop(@n, (@index + 1)); // Next iteration.
}
@keyframes anim {
    .loop(20); // Launch the loop.
}
Run Code Online (Sandbox Code Playgroud)

我想把这个Sass翻译成Less:

@keyframes anim{ 
    $steps:20; 
    @for $i from 0 through $steps{ 
        #{percentage($i*(1/$steps))}{ 
            // code 
        } 
    } 
}
Run Code Online (Sandbox Code Playgroud)

css animation loops less css-animations

5
推荐指数
1
解决办法
872
查看次数

标签 统计

animation ×1

css ×1

css-animations ×1

less ×1

loops ×1