使用变量的Mootools变形

我正在为我的网站创建一个javascript函数,该函数接受多个参数,然后使用所述参数执行变形.而不是普通的东西,但是变形不起作用.似乎通过获取我想要变形的css属性(即,高度)作为变量,我正在调试.

使用的基本代码：

window.addEvent('load', function() {
    var box = $('box');
    var sfx = new Fx.Morph(box, {
        duration: 1000,
        transition: Fx.Transitions.linear
    });
    
    var cssParam = 'height';
    var endVal = '100';
    
    sfx.start({cssParam endVal});
    console.log(sfx);
});

#box {
    width:200px;
    height:200px;
    background-color: #FFFFFF;
    border: 1px solid #000000;
}

<div id="box"></div>

变形从字面上接受变量cssParam,并试图将cssParam变形为100.显然我做错了,如何解决此问题？

解决方法:

er

这不是ES6 / 7-您还不能在JavaScript对象文字中使用动态对象成员.

这：sfx.start({cssParam endVal});是错的.

重写为：

var morphObject = {};
morphObject[cssParam] = endVal;
sfx.start(morphObject);

在ES6中,您将具有：

var obj = {
    ['foo' + Date.now()]: 42,
    [cssParam]: endVal
};

在现代的浏览器中,上面的方法就可以了(适用于FF和Chrome最新版本)

标签：mootools,javascript
来源： https://codeday.me/bug/20191120/2046231.html