Помощник
 |
|
|
|
|
Сообщение сайта
|
 ScrollTo |
stan07
|
Сообщение
#1
|
||
 0  Группа: User Сообщений: 66 Регистрация: 17.11.2011 Поблагодарили: 0 раз Репутация:  0 
 |
|
||
 |
|
||
|
klenovnn
|
 20.5.2014, 10:07;
Ответить: klenovnn
Сообщение
#2
|
|
Новичок Группа: Viewer Сообщений: 0 Регистрация: 6.5.2009 Поблагодарили: 0 раз Репутация: 0
|
Привет
Меню только там не по центру. Вот пример – http://klenovnn.ru/work/html/jackmobile/catalog1.html Тебе нужны следующие скрипты: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="./js/jquery.localscroll.js"></script> <script src="./js/jquery.scrollTo-1.4.3.1-min.js"></script> И из этого файла файла http://klenovnn.ru/work/html/jackmobile/js/common.js выдерни все, кроме .menu где используется. Принцип работы следующий – по умолчанию это обычная верстка. Когда мы прокручиваем больше чем на 163px function checkScroll(){ var html = document.documentElement; var html1 = document.body; if ((html.scrollTop > 163) || (html1.scrollTop > 163)) { $(".wrapper").addClass('scroll'); } else { $(".wrapper").removeClass('scroll'); } } Мы для основного дива .wrapper докидываем класс .scroll, а в css у нас прописано, что если этот класс есть, то меню получает параметры position: fixed. При этом для самого .wrapper мы сверху добавляем padding-top: "высота меню", потому что сначала меню у нас position: relative, а после fixed и все блоки по умолчанию прыгают вверх. |
|
|
|
|
stan07
|
Сообщение
#3
|
|
0 Группа: User Сообщений: 66 Регистрация: 17.11.2011 Поблагодарили: 0 раз Репутация: 0
|
(klenovnn @ 20.5.2014, 13:07)  Привет Меню только там не по центру. Вот пример – http://klenovnn.ru/work/html/jackmobile/catalog1.html Тебе нужны следующие скрипты: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="./js/jquery.localscroll.js"></script> <script src="./js/jquery.scrollTo-1.4.3.1-min.js"></script> И из этого файла файла http://klenovnn.ru/work/html/jackmobile/js/common.js выдерни все, кроме .menu где используется. Принцип работы следующий – по умолчанию это обычная верстка. Когда мы прокручиваем больше чем на 163px function checkScroll(){ var html = document.documentElement; var html1 = document.body; if ((html.scrollTop > 163) || (html1.scrollTop > 163)) { $(".wrapper").addClass('scroll'); } else { $(".wrapper").removeClass('scroll'); } } Мы для основного дива .wrapper докидываем класс .scroll, а в css у нас прописано, что если этот класс есть, то меню получает параметры position: fixed. При этом для самого .wrapper мы сверху добавляем padding-top: "высота меню", потому что сначала меню у нас position: relative, а после fixed и все блоки по умолчанию прыгают вверх. Большое спасибо! P.S. почему-то у меня сработало без padding-top: "высота меню" ,незнаю вот сайт - Babaika/ |
|
|
|
|
Galen
|
21.5.2014, 15:54;
Ответить: Galen
Сообщение
#4
|
|
 0 Группа: User Сообщений: 1269 Регистрация: 3.10.2008 Поблагодарили: 0 раз Репутация: 0
|
(stan07 @ 20.5.2014, 17:56) почему-то у меня сработало без padding-top: "высота меню" Это зависит от конкретной верстки, где-то отступ нужен, где-то нет.
|
|
|
|
|
|
|
|
|
Текстовая версия | Сейчас: 23.4.2024, 14:21 |
