@VladimirKrasnov

Как заменить один элемент другим при скролле?

Есть 2 diva

<div id="elem1">Пики точеные</div>
<div id="elem2">Не точеные</div>


Div с elem1 виден изначально, в то время как elem2 скрыт. Когда юзер скроллит страницу, elem1 уползает вверх и пропадает, в замен его вылезает elem2, который fixed-top.

Как такое можно реализовать? По сути хочу при скролле заменить большую шапку странницы, более компактной
  • Вопрос задан
  • 80 просмотров
Решения вопроса 1
Пригласить эксперта
Ответы на вопрос 1
@Chamalion
JQuerry функция

$(document).ready(function() {
$(window).scroll(function() {
if ($(this).scrollTop() > 55) {
#elem1 - display: none;
#elem2 - display: block;
}
else {
Наоборот
}
});
});


Тут я не знаю как вставить CSS код в JS, пусть кто-нибудь подскажет, но идея такая. Вместо 55 вставишь другое число (разница между высотой большого и компактного меню в пикселях)
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы