1

我知道这在技术上不是 DOM 的一部分,但有人有一个很好的方法来通过 jquery 添加/删除 CSS3:

#Current > span:after, .animate > span > span

所以我基本上可以执行这种操作:

$('#Current > span:after, .animate > span > span').css({
        WebkitTransition : 'move 2s linear infinite',
        MozTransition    : 'move 2s linear infinite',
        MsTransition     : 'move 2s linear infinite',
        OTransition      : 'move 2s linear infinite',
        transition       : 'move 2s linear infinite'
});
4

3 回答 3

1

像这样的东西应该可以正常工作。例如,为什么不把你想添加的东西放到一个类中,然后做一些类似的事情:

$('#Current > span:after, .animate > span > span').addClass('transitionClass');

通过这种方式,您可以提高代码的可读性并将样式与代码逻辑分开。如果你需要单独做 CSS,你应该参考这个 SO post

于 2013-11-12T14:36:23.657 回答
0

我同意 jtromans,但是如果您正在创建一些东西,例如没有 css 的 js 插件/组件,您需要直接工作而没有任何其他文件依赖,那么您可以设置这种 css3 属性,如下所示,

/*add properties*/
$('div').css({
    'transform':'rotate(7deg)',
    '-ms-transform':'rotate(7deg)',
    '-webkit-transform':'rotate(7deg)',
    '-o-transform':'rotate(7deg)',
    '-moz-transition':'rotate(7deg)'
});

http://jsfiddle.net/p2w7C/

/*remove*/
$('div').css({
        'transform':'none',
        '-ms-transform':'none',
        '-webkit-transform':'none',
        '-o-transform':'none',
        '-moz-transition':'none'
    });

一个简单的功能可能是,

$(document).ready(function () {
    function transform(selector, value) {
        $(selector).css({
            'transform': value,
             '-ms-transform': value,
             '-webkit-transform': value,
             '-o-transform': value,
             '-moz-transition': value
        });
    }
    transform('div', 'rotate(7deg)');
});

http://jsfiddle.net/Hk6JE/

于 2013-11-12T14:44:17.747 回答
0

我认为一个好方法是使用$.toogleClass函数,它允许您轻松添加和删除 css 类。

于 2013-11-12T14:56:09.160 回答