Как устранить дрожания при развертывании контейнера?

Question

[Владимир Коротенко]

Я набросал примерный код, который воспроизводит поведение на боевом сервере.
Шаги для повторения:

1. запустить чат
2. нажать кнопку "Resize"

При изменении чата наблюдается подрагивание элементов внутри области прокрутки примерно в 1px.
Как с этим бороться?

https://jsfiddle.net/vkorotenko/cx4d6vsh/

Comments

[Сергей Карвасарный]

https://learn.javascript.ru/js-animation вот посмотри, тебе нужно использовать setInterval для плавности анимации чтобы за определенное время изменялось значение чтобы глазу казалось, что все плавно) FPS как в играх)

[Владимир Коротенко]

Сергей Карвасарный, К сожалению не все так просто.



При изменении размеров в цикле анимации, контейнер перестраивается и появляется неприятное подергивание +/- 1 пиксель

Пришлось создать контейнер (2) для него указать стили динамически вычисляемые при загрузке страницы

height: 1146px;
    position: fixed;
    bottom: 0px;

В списке сообщений у первого элемента указать

margin-top: auto;

И пересчитывать высоту этого контейнера по окончанию анимации.