Задать вопрос
@danchiksux
Говнокодер
javascript

Компактная шапка сайта, как вернуть в прежний вид?

Есть шапка:
<div class="head"></div>
.head {
	top: 0;
	width: 100%;
	height: 200px;
	background: blue;
	position: fixed;
}

При прокрутке она уменьшается:
$(document).ready(function() {
	$(window).scroll(function() {
		$('.head').animate({
		height: "100px",
	}, 500);
	});
});

Полный код
Как сделать что-бы при прокрутке страницы в самый верх она снова принимала прежний вид?
  • Вопрос задан
  • 83 просмотра
Комментировать
Подписаться 1 Средний Комментировать
Решения вопроса 1
Serj-One
@Serj-One
i'm sexy and i know it
Оформление в js - моветон. Подобные вещи делаются через добавление/удаление классов с нужными свойствами.
$(window).scroll(function() {
    var top = $(window).scrollTop();  
    if(top>0){
        $('.header').addClass('header--min');
    } else {
        $('.header').removeClass('header--min');
    }
});

Классом .header--min{} задавай изменения состояния.
Ответ написан
8 комментариев
8 комментариев
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
summer • Ярославль
от 100 000 до 140 000 ₽
Junior JavaScript Developer
КРАФТТЕК • Санкт-Петербург
от 60 000 до 80 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Извлечение метрик и профилирование серверных ресурсов, Yandex Cloud
19 апр. 2024, в 18:38
1500 руб./в час
Верстка сайта -4-5 страниц
19 апр. 2024, в 18:36
1500 руб./за проект
MiniApp для телеграмм на React
19 апр. 2024, в 18:36
30000 руб./за проект
Ещё заказы