jquery - анимация до состояния класса.

[winch]

когда мне требуется анимировано позиционировать элемент, я пользуюсь функцией:

$(selector).animate({...css_state...});

когда мне надо установить css состояние определенное в классе, я использую:

$(selector).addClass(class_name);

а как быть, если надо добавить класс, но сделать это анимационно?

[j0hnik]

прописать в css

.class{
		transition: 1s;
	}

[laimas]

надо добавить класс, но сделать это анимационно

Это как поооостепенно класс добавлять?

Можно по окончании анимации класс добавить. А вам чего надо?

[winch]

Это как поооостепенно класс добавлять?

Можно по окончании анимации класс добавить. А вам чего надо?

например так

.class { margin:100px; }

надо чтобы, при добавлении этого класса, маргин плавно изменился от текущего состояния элемента, до 100 пикс.

[winch]

.class{
		transition: 1s;
	}

в этом при добавлении класса плавность работает, а при снятии (removeClass) - происходит резко. как тогда при снятии плавности добиться?

[winch]

laimas,
вариант сначала сделать анимацию, а потом добавить класс не канает, потому что у меня в js коде нет значений css параметров до которых мне надо анимировать. а эти значения находятся в классе.
т. е. я хочу разделить js и css код, таким образом чтобы в скрипте был только алгоритм, а все настройки параметров хранились в css.

[laimas]

надо чтобы маргин плавно изменился от текущего состояния элемента, до 100 пикс

Ну так это же не анимация добавления класса, а анимация css свойства. Это можно сделать и через CSS анимацию (@keyframes), можно и программно, через .animate().

[winch]

laimas,
что такое @keyframes ?
через animate() не могу, читайте выше.

[рони]

winch,
обычно делают 2 класса в одном transition: 1s; в другом margin:100px;

[winch]

winch,
обычно делают 2 класса в одном transition: 1s; в другом margin:100px;

не совсем понял, как это. можно пример кода?