При запуске анимации Jquery, такой как slideDown (), создается впечатление, что ряд свойств css для отдельных элементов настроено на обновление через определенный интервал, а когда анимация завершена, эти свойства не установлены, а свойство display просто установлено на авто или что угодно. По крайней мере, в firebug вы больше не видите эти временные свойства.
Проблема, с которой я столкнулся, - это сценарий, в котором мы останавливаем слайд с помощью stop (). Затем элемент остается с текущими временными значениями CSS. Это хорошо, потому что это должно, но позвольте нам сказать, что я остановил слайд, потому что я решил снова немного поднять его обратно. Это будет выглядеть примерно так:
$(this).slideDown(2000)
//The below events is not in queue but will rather start execute almost
simultaneously as the above line. (dont remember the exact syntax)
$(this).delay(1000).stop().slideUp(2000)
Приведенный выше код может не иметь особого смысла, но суть:
После 1 секунды скольжения анимация останавливается, и она начинает скользить вверх. Работает как шарм.
НО !!! И здесь проблема. Как только он сдвинулся вверх, свойства css элементов сбрасываются на точные значения, которые были у него в 1000 мс, в анимацию slideDown () (когда вызывался stop ()). Если мы сейчас попробуем запустить следующее:
$(this).slideDown(2000)
Он будет скользить вниз до той точки, в которой предыдущий слайд-бар был прерван, и не дальше на половине скорости (поскольку он использует то же время примерно для половины высоты). Это потому, что свойства CSS были сохранены, как я вижу. Но это не особенно желательно. Конечно, я хочу, чтобы в этот раз он опустился до упора.
Из-за взаимодействия с пользовательским интерфейсом, который трудно предсказать, все может скоро сломаться. Более длинные анимации, которые мы используем, увеличивают риск того, что что-то подобное произойдет.
Это считается ошибкой или я что-то не так делаю? Или, может быть, это просто функция, которая не поддерживается?
Полагаю, я могу использовать функцию обратного вызова для сброса свойств css, но в зависимости от используемой анимации для ее рендеринга используются разные свойства css, и прикрытие спины может привести к довольно не слишком причудливому решению.