使用这个简洁的小插件http://ricostacruz.com/jquery.transit，非常类似于jQuery内置的对以下内容的支持：
$('.some-element').css({propname1: 'value1', propname2: 'value2'});
它的工作原理如下：
$('.some-element').transition({ x: '40px', y: '40px' });
并且我可以像这样使用变量作为属性值（这可行）：
var xVal = '40px',
yVal = '40px';
$('.some-element').transition({ x: xVal, y: yVal });
但我需要能够通过像这样的变量来指定转换的“类型”（这不起作用）：
<div class="some-element" data-ca-type1="x" data-ca-type2="y"></div>
var xVal = '40px',
yVal = '40px',
target = $('.some-element'),
type1 = target.data('caType1'),
type2 = target.data('caType2');
target.transition({ type1: xVal, type2: yVal });
您可以[]在数组和对象上使用以设置动态属性值。
transitionData = {};
transitionData[type1] = xVal;
transitionData[type2] = yVal;
target.transition(transitionData);
我倾向于内联这些事情，这可以通过实例化一个匿名函数来完成：
target.transition(new function () {
this[type1] = xVal;
this[type2] = yVal;
}());
尽管通常我可能只将过渡数据[data-*]作为JSON直接保留在属性中，但是利用jQuery的自动解析功能.data()：
<div data-ca='{"x":"40px","y":"40px"}'></div>
$('[data-ca]').each(function () {
$(this).transition($(this).data('ca'));
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句