Анимация смены позиции javascript?

Question

[WebDev]

При прокрутке страницы по некоторым условиям нужно, чтобы блок:
- был зафиксирован сверху
- был зафиксирован снизу
- вел себя по дефолту

В условиях это получается примерно так:

if (condition1) {
    block.css({'position' : 'fixed', 'top' : 0, 'bottom' : 'auto'});
} elseif (condition2) {
    block.css({'position' : 'fixed', 'top' : 'auto', 'bottom' : 0});
} else {
    block.css({'position' : 'static', 'top' : 'auto', 'bottom' : 'auto'});
}

Как в этом случае сделать плавную смену положения? Замена css на animate не работает.

Answer 1

[iBird Rose]

добавляй классы типа:

if (condition1) {
    block.addClass('fixed-1');
} elseif (condition2) {
    block.addClass('fixed-2');
} else {
    block.addClass('fixed-3');
}

а уже в css стилизуй их. и используй transition для плавности