时间戳

首页 > 解决方案 > $slider.css({'transform' : 'translateY(' + (-$height * $counter) + 'px)'})

javascript - $slider.css({'transform' : 'translateY(' + (-$height * $counter) + 'px)'})

问题描述

$slider.css({
    'transform' : 'translateY(' + (-$height * $counter) + 'px)'
})

我一直在破解这段代码。有人可以向我详细解释/打破这一点。

标签： javascriptjquery

解决方案

这就是我理解这段代码的方式：

$slider.css({
    'transform' : 'translateY(' + (-$height * $counter) + 'px)'
})

$slider是您使用 javascript 应用 css 的DOM 元素。

$height是一个变量，其中包含一些作为高度值的数值。

$counter是一个包含数值的变量。根据它的名字，它是一个计数器值。

整个代码将Transform$slider css 属性应用于变量引用的 DOM 元素。

如果我们用它们的值替换这些变量，我们将有：

var $height = 5
var $counter = 3
var $slider = $(".slider")
$slider.css({
     'transform' : 'translateY('+ (-$height*$counter)+ 'px') //equals to 'transform' : 'translateY('+ (-5*3)+ 'px')
})

推荐阅读