Задать вопрос
keslo
@keslo
css

Как сделать так, чтобы анимированный баннер на CSS3 показывал анимацию только один раз?

Добрый день, господа!

1. Есть пример баннера tympanus.net/Tutorials/AnimatedWebBanners/
2. Анимация запускается при каждом обновлении страницы

Как сделать так, чтобы этот анимированный баннер (на CSS3) показывал анимацию только один раз для пользователя при посещении первой страницы сайта? Т.е. при последующих переходах по страницам сайта банер должен оставаться в конечном положении анимации.

Если как-то коряво выразился, то извиняйте :-)
  • Вопрос задан
  • 4602 просмотра
Комментировать
Подписаться 9 Оценить Комментировать
Решения вопроса 1
mitry
@mitry
Если это первое посещение (куки не установлен), то на сервере или с помощь JS добавлять класс «first-visit» к BODY или банеру. А в стилях применять анимацию только к наследнику «first-visit»
Ответ написан
1 комментарий
1 комментарий
Пригласить эксперта
Ответы на вопрос 2
@servekon
При первом посещении страницы писать куки, что анимированный банер показан. На других страницах проверять наличие/значение этой куки. И если надо, просто показывать картинку с конечным положением анимации.
Ответ написан
1 комментарий
1 комментарий
Glebcha
@Glebcha
Можно и с local storage попробовать.
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Frontend React
Glob-com
от 100 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Отрисовать дизайн страницы "Календарь мероприятий" для школы бизнеса
20 апр. 2024, в 16:12
1000 руб./за проект
Разработать англоязычную версию корпоративного сайта на Statamic
20 апр. 2024, в 15:58
1500 руб./в час
Запись обучающих роликов и написание по машинному обучению
20 апр. 2024, в 15:40
3000 руб./за проект
Ещё заказы