2

この質問によると、プロパティがオブジェクトに含まれていないかどうかを確認する必要があります。

それで、いくつかのスタイリングがあります：

.foo {
    top: 13px;
    width: 37px;
}

...そして、このようなオブジェクト:

var keyframe = {
    0: {
        top: 0
    },
    1000: {
        top: 100
    },
    2000: {
        width: 100
    }
};

次/前のフレーム項目にないすべてのプロパティを反復処理して、不足しているプロパティに jQuery オブジェクトの css 値を入力する必要があります。

最終的なオブジェクトは次のようになります。

var keyframe = {
    0: {
        top: 0,
        width: '37px'
    },
    1000: {
        top: 100,
        width: '37px'
    },
    2000: {
        top: 100,
        width: 100
    }
};

私はこのようなことを試しました：

http://fiddle.jshell.net/WdNge/

var $foo = $('.foo');
for (var key in keyframe) {
    var obj = keyframe[key];
    for(var ok in obj) {
        if (!(ok in obj)) obj[ok] = $foo.css(ok);
    }
}

しかし、それは

if (!(ok in obj)) // is always `truthy`

ただし、直接宣言すると

if (!('top' in obj)) // it works...

何か案は？

アップデート

私もこのようなことを試みましたが、成功しませんでした:

http://fiddle.jshell.net/WdNge/1/

var $foo = $('.foo');
var keys = [];
for (var key in keyframe) {
    var obj = keyframe[key];
    var k = Object.keys(obj);
    keys.push(k[0]);
    for(var i = 0; i < keys.length; i++) {
        var ok = keys[i];
        if (!(ok in obj)) obj[ok] = $foo.css(ok);
    }
}
4

1 に答える 1

0

私の知る限り、jQuery/Javascript を使用してクラスから指定された CSS プロパティを抽出することはできません。

つまり、a).fooクラス仕様を JavaScript 内に JSON として個別に保存するか、b) jQuery が認識するすべての CSS プロパティを反復処理する必要があります。

CSS

.foo {
    top: 0;
    width: 100px;
}

Javascript

var foo_styles = { top: 0, width: "100px" },
    keyframe = {
    0: {
        top: 0
    },
    1000: {
        top: 100
    },
    2000: {
        width: 100
    }
};
for (var key in keyframe) {
    var frame = keyframe[key];
    for(var frameProperty in foo_styles) {
        if (!(frameProperty in frame)) {
            frame[frameProperty] = foo_styles[frameProperty];
        } else {
            // Update with last value from keyframe
            foo_styles[frameProperty] = frame[frameProperty];
        }
    }
}
于 2013-07-16T14:09:43.017 に答える