Страница 1 из 11
Форум » Форум веб-мастеров » uCoz » Прозрачная шапка
Прозрачная шапка
#1
  • Проверенный
  • PipPipPipPipPip
  • 37 сообщений

Отправлено 28.05.2016 - 19:01

Хотел бы узнать как можно сделать , чтобы шапка сайта, а точнее меню при прокрутки в низ становилась чуть прозрачно? Т.е Моя шапка при отпуске в низ обычная темная, а как сделать , чтобы стала чуть прозрачной ?

Я уже обязан этому сайту, вас к себе как Партнер поставлю =))

#2
  • Администратор
  • PipPipPipPipPip
  • 154 сообщения

Отправлено 30.05.2016 - 15:02

Этот js запихни в head либо в какой-то глобальный блок, который присутствует на всех страницах:

Код
$(window).scroll(function() {
if ($(this).scrollTop() > 1){
$('.header').addClass("opacity");
}
else{
$('.header').removeClass("opacity");
}
});

header - это класс шапки
А вот это в CSS:
Код
.scroll_opacity {
opacity: 0.6;
transition: all 0.4s ease;
}

Если я долго не выполняю обещаний, напомните мне в ЛС. Скорее всего, я просто забыл.
#3
  • Проверенный
  • PipPipPipPipPip
  • 37 сообщений

Отправлено 31.05.2016 - 16:24

Что-то не вышло

#4
  • Администратор
  • PipPipPipPipPip
  • 154 сообщения

Отправлено 31.05.2016 - 20:18

Ой, я забыл в скрипте класс для прозрачности сменить wacko
В js скрипте замени opacity на scroll_opacity

Если я долго не выполняю обещаний, напомните мне в ЛС. Скорее всего, я просто забыл.
#5
  • Проверенный
  • PipPipPipPipPip
  • 37 сообщений

Отправлено 04.06.2016 - 10:56

Snoopak, Что-то не вышло, вроде все правильно сделал

#6
  • Администратор
  • PipPipPipPipPip
  • 154 сообщения

Отправлено 04.06.2016 - 11:26

В скрипте upcode.ucoz.net/js/head.js замени

Код
$('.header').addClass("opacity");
на
Код
$('.header').addClass("scroll_opacity");

Если я долго не выполняю обещаний, напомните мне в ЛС. Скорее всего, я просто забыл.
#7
  • Проверенный
  • PipPipPipPipPip
  • 37 сообщений

Отправлено 04.06.2016 - 17:21

Snoopak, Вот, вроде получилось, но она стала вся прозрачной, т.е
На самом верху она должна быть темной, а при скроле(Отпуске в низ) становится прозрачной .

#8
  • Администратор
  • PipPipPipPipPip
  • 154 сообщения

Отправлено 05.06.2016 - 08:22

В файле head.js замени все содержимое на это:

Код
$(window).scroll(function() {
if ($(this).scrollTop() > 1){
$('.header').addClass("scroll_opacity");
}
else{
$('.header').removeClass("scroll_opacity");
}
});
И все будет как надо)

Если я долго не выполняю обещаний, напомните мне в ЛС. Скорее всего, я просто забыл.
#9
  • Проверенный
  • PipPipPipPipPip
  • 37 сообщений

Отправлено 05.06.2016 - 10:53

Snoopak, О спасибо большое! Можно закрыть тему =)

Форум » Форум веб-мастеров » uCoz » Прозрачная шапка
Страница 1 из 11
Поиск:
© 2012-2017 «For-uCoz». Дизайн и верстка Snoopak Хостинг от uCoz