Как оптимизировать эту CSS3 запись для jQuery?

Question

[Urukhayy]

$(this).css({
		"transition-delay" : "1s",
		"-webkit-transition-delay" : "1s",					
        	"-o-transition-delay" : "1s",
		"-moz-transition-delay" : "1s",		
		
		"transform" : "translate(800px,0px)",
		"-webkit-transform" : "translate(800px,0px)",
		"-o-transform" : "translate(800px,0px)",
		"-moz-transform" : "translate(800px,0px)",

                "transition" : "transform 0.3s ease",
                "-o-transition" : "transform 0.3s ease",
                "-moz-transition" : "transform 0.3s ease",
                "-webkit-transition" : "transform 0.3s ease"
		});

Такая запись очень громоздка, особенно если к одному и тому-же объекту приходится применять несколько видов transform в зависимости от ситуации. Как можно оптимизировать?

Answer 1

[IVAN SAVCHENKO]

Вынести в отдельный файл с классами для анимаций и в js присваивать нужный класс. Ну или написать одну функцию и передавать в неё параметры анимаций.

Answer 2

[Сергей Мельников]

вообще задавать стили в js - дурной тон, но уж если никак иначе - используйте готовые решения:
modernizr.com
ricostacruz.com/jquery.transit

Comments

[Urukhayy]

Ну а как быть, если нужно по клику применять transform? Причем в функции "переключателя".

[Сергей Мельников]

Urukhayy: yну как бы добавить элементу класс, а потом убрать?!

[Urukhayy]

Сергей Мельников: Уну а когда мы будем убирать, он снова переместится на прежнюю позицию?)