Задать вопрос
MaXComp
@MaXComp
интересуюсь frontend html+css+JS+php. Linux, C
html

Возможно ли с помощью CSS сделать плавно выдвигающийся заголовок, при открытии страницы?

Ну т.е. что бы при переходе на любую страницу, плавно выезжал её заголовок.
С помощью ссылки (a), псевдоэлементов, псевдоклассов (before, after), трансформа (transform) и например ховера (hover) это реализовать можно. Т.е. при наведении на ссылку произойдет плавный подъезд текста.
А вот как сделать, что бы без всяких ховеров просто само выехало и осталось?
  • Вопрос задан
  • 643 просмотра
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 1
qork
@qork
{ background: #F00B42 }
https://daneden.github.io/animate.css/
или напиши свою анимацию на @keyframes
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ответы на вопрос 2
Carduelis
@Carduelis
Web-developer, front-end, js, less
  1. Добавьте в css нужный класс с описанием анимации
  2. В html его не вставляйте
  3. С помощью скрипта добавьте класс к нужному тегу
  4. ???
  5. При добавлении класса к элементу, анимация тут же применится

Как сделать на javascript код? (вариант попроще, для новичка)
  1. Создаем функцию добавления класса к элементу по его идентификатору
    function setClassForAnimation() {
  var header = document.getElementById('idOfHeader');
  header.classList.add('animate')
}

  2. Отслеживаем загрузку html-дерева с помощью события onload, где вызываем нашу функцию <body onload="setClassForAnimation()">
Ответ написан
3 комментария
3 комментария
Antonoff
@Antonoff
Разработчик
JavaScript в помощь
Ответ написан
1 комментарий
1 комментарий
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик (React)
ДАЛЕЕ
от 130 000 ₽
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Настройка соединения ноутбука на Debian с удалённым VDS-сервером с GUI
18 апр. 2024, в 14:56
1500 руб./за проект
HTML -вёрстка email рассылки
18 апр. 2024, в 14:41
27000 руб./за проект
Клиент для обращения к ByBit Private Api с помощью имеющихся куков
18 апр. 2024, в 14:22
2000 руб./за проект
Ещё заказы