Поддержка → Проблемы и решения → Разные классы для хедера при скролле

Разные классы для хедера при скролле

  • Решено stasps

    (@stasps)


    5 лет, 1 месяц назад

    Здравствуйте. Появилась проблема. Есть плавающий хедер. Но когда нету скролла ( Мы в начале страницы) текст сливается с слайдером. Хотел сделать так что бы в начальном состоянии тексты был белый, а когда скролим — текст в хедере черный. Поскольку текст в одном классе — разные стили к тексту в хедере поставить не могу.
    Возможно кто то подскажет как воплотить в реальность идею.

    Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]

Просмотр 7 ответов — с 1 по 7 (всего 7)
  • Модератор Yuri

    (@yube)

    5 лет, 1 месяц назад

    Поскольку текст в одном классе

    Не совсем. Классы section с хедером меняются при скролле
    с
    header-site header-sticky header-overlay header-left
    на
    header-site header-sticky header-overlay header-left is_stuck is_stuck_show

    Автор stasps

    (@stasps)

    5 лет, 1 месяц назад

    Спасибо. Сейчас попробую переписать стили.
    Я думал создавать Window.addEventListener(‘scroll’, () => {}) и слушать когда скрол 0 подтягивать один класс, а если больше 0 то другой класс.

    tuxfighter

    (@tuxfighter)

    5 лет, 1 месяц назад

    .nav li a {
    color: white !important;
}

.is_stuck_show .nav li a {
    color: black !important;
}
.nav li.current_page_item a {
    color: #c73112 !important;
}
    Автор stasps

    (@stasps)

    5 лет, 1 месяц назад

    С меню работает супер, а вот с названием почему-то не хочет работать(

    .sitename sitetitle a{
	color: white !important;
}
    • Ответ изменён 5 лет, 1 месяц назад пользователем stasps.
    tuxfighter

    (@tuxfighter)

    5 лет, 1 месяц назад

    с названием почему-то не хочет работать

    .site-description .sitename.sitetitle a {
    color: white !important;
}
.is_stuck_show .site-description .sitename.sitetitle a {
    color: black !important;
}
    tuxfighter

    (@tuxfighter)

    5 лет, 1 месяц назад

    .sitename sitetitle a

    точки нет
    .sitename.sitetitle a

    Автор stasps

    (@stasps)

    5 лет, 1 месяц назад

    Да! Все работает круто!
    Благодарен!

Просмотр 7 ответов — с 1 по 7 (всего 7)
  • Тема «Разные классы для хедера при скролле» закрыта для новых ответов.

Просмотр