javascript - jQuery - animate() 属性

Question

我正在使用 jQuery 的 animate像这样的功能:

var css1 = {
      display: "block",
      marginTop: 20
    };

var direction = "marginTop";

$(element).animate(css1, 150, 'swing'); 

注意上面的 marginTop 属性。好吧，我想用 direction 变量替换它，但由于某些原因它不起作用。有谁知道为什么吗？

稍后编辑: 基本上我想替换:

var css1 = {
      display: "block",
      marginTop: 20
    };

与

var css1 = {
      display: "block",
      direction: 20
    };

问题是 jQuery 似乎没有将“direction”识别为“marginTop”属性

Answer 1

你可以使用 bracket notation 做你想做的动态属性，像这样:

var direction = "marginTop";
var css1 = { display: "block" };
css1[direction] = 20;

$(element).animate(css1, 150, 'swing');

执行 css1.marginTop 也可以通过 css1["marginTop"] 访问，您可以为第二个(括号表示法)版本使用变量。