Дія під час анімації jQuery
Вітаю! Підкажіть будь ласка, як краще зробити. Є каруселька, яка, в даному випадку, має прокрутитися на 500px. Видимість обмежена першими 5 елементами, де центральний 300*300, наступний і попередній від нього 200*200, решта 100*100. Центральний має клас великий, з боків з центрального middle. Потрібно, щоб при прокручуванні класи теж рухалися на наступні елементи, зараз це працює, але із запізненням, тому що присвоєння класів відбувається після анімації. Як зробити, щоб присвоєння класів наступним елементам було під час анімації?
Ось шматок коду, де це відбувається:
Можете задіяти css анімацію зі збільшення/зменшення розмірів швидкість якої буде відповідати стоскорості повної js анімації. Тут приклад анімації. зверніть увагу на рядок
transition: width 1s linear, height 1s linear;
там за секунди вказано швидкість анімації. А в js Я просто змінюю клас. Тобто вам не потрібно робити це у циклі. Ви просто змінюєте класи для елементів та запускаєте анімацію каруселі. Повинно все вийти у кращому вигляді.
Є й інший складніший варіант. У js ф-ції animate є параметр step це ф-ція, що відповідає за один крок анімації. Ось приклад з дока:
Тобто Ви можете прописати тут всі зміни, які повинні відбуватися з Вашим блоком. Ну там зрушення вліво/вправо та захоплення/зменшення деяких елементів. І наприкінці анімації поміняти класи.