Изменение текста с эффектом перехода (масштабирование / исчезновение)

#javascript #jquery #css

#javascript #jquery #css

Вопрос:

Я наткнулся на этот интересный эффект в http://birvacreativestudio.com/theme/birva200/index.html То, о чем я говорю, — это изменение текста (вероятно, первое, что вы заметите). Я вызвал инспектора, чтобы посмотреть, как это было сделано, но не могу понять, использует ли разработчик для этого кошелек css или какую-то смесь с javascript / jQuery?

Кто-нибудь может объяснить мне, как воспроизвести его с помощью jQuery? Существуют ли какие-либо плагины / библиотеки, которые подходят для такого типа эффектов?

Комментарии:

1. Похоже, они используют CSS-анимацию для эффекта «отскока». Затем они используют JS для добавления класса к текущему активному тексту, чтобы он входил / выходил. Таким образом, анимация выполняется в CSS, но слайд-шоу выполняется в JS. ОБНОВЛЕНИЕ: я думаю, что я смотрел на неправильную анимацию, слова, которые исчезают / исчезают, выполняются с помощью CSS-переходов (не анимаций), но JS по-прежнему контролирует слайд-шоу.

Ответ №1:

Они используют Owl Carousel.

Смотрите переход FadeUp здесь: http://owlgraphic.com/owlcarousel/demos/transitions.html

Ответ №2:

Вы можете легко получить отличную анимацию текста с помощью этой платформы анимации JS: http://www.greensock.com/gsap-js /

(просто посмотрите на анимированный заголовок на этой странице, вы увидите, что с этим можно сделать это быстрее, чем jQuery animate)