фиксированное верхнее меню в 2

#1 21 февраля 2015 в 08:08
Ребята подскажите как в дефолтном шаблоне в 2, зафиксировать главное меню, что бы при скролле оно оставалось вверху!??
#2 21 февраля 2015 в 09:10
position: fixed;
top: 0;
#3 21 февраля 2015 в 09:13
да я так и делаю, но у слайдера на главной странице position: absolute; и поэтому неполучается, а на странице контента где новости работает, и на странице профиля конфлик какой то!!! есть мысли как это обойти ??
#4 21 февраля 2015 в 10:24
position: fixed;
top: 0px;
width: 100%; Тут по обстоятельствам… Не помню стандартный шаблон )))
z-index: 100;
margin: auto;
#5 22 февраля 2015 в 08:26
очень интрересно!!! не работало, пока не поставил скрип от вконтакте — где выводит группу сообщества!!! Может кому пригодится!!))Щас заработало!!)

вставил вот это и разаботало —
  1. <script type="text/javascript" src="http://userapi.com/js/api/openapi.js?52"></script>
  2. <script type="text/javascript">
  3. VK.init({apiId: 3136754,onlyWidgets: true});
  4. </script>
почему так сам непонял!!! Но главное заработало!!!
#6 22 февраля 2015 в 09:44

вставил вот это и разаботало -
Код PHP:

<script type="text/javascript" src="http://userapi.com/js/api/openapi.js?52"></script>
<script type="text/javascript">
VK.init({apiId: 3136754,onlyWidgets: true});
</script>

почему так сам непонял!!! Но главное заработало!!

vsemkrot
laughИнтересно vsemkrot вы действительно думаете что меню из за этого скрипта стало фиксированным?
#7 22 февраля 2015 в 09:55
Atid — Gorec, я прописал position: fixed;
top: 0px;
width: 100%;
z-index: 100;
margin: auto;

и стало фиксированным, но конфликтовала со слайдером на главной странице (вы бы сначало прочитали выше что написано!!!), после установке скрипта от вконтакте конфликт пропал!!!
#8 22 февраля 2015 в 12:52
vsemkrot, я почитал ваше сообщение, вы не в скриптами работаете чтобы был конфликт чем либо. Вот вы говорите что он конфликтует с слайдером, в чем это выражается? Можно в личку ссылку на ваш сайт?

Вот код для фиксации, не забудьте для блока который расположен после меню добавить верхний отступ равную высоте самого меню (если ваше меню высотой 50 пикселей то для блока расположеного после него необходимо задать отступ от верхнего края минимум 50 пикселей)
<div class="fixed">
<div classs="menu">

</div>
</div>
fixed {
top:0;
left: 0;
position: fixed;
right: 0;
z-index: 1000;
}
.menu {
margin:0 auto;
width: ширина вашего сайта;
}
#9 22 февраля 2015 в 13:07
конфликт был в том что ниже слайдера сайт не прокручивался,(если меню фиксированое), а после установке скрипта от вконтакте стал нормально прикручиватся!

делал так — в main.tpl.php в <head>....</head> прописал —
  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3. var HeaderTop = $('#headermenu').offset().top;
  4.  
  5. $(window).scroll(function(){
  6. if( $(window).scrollTop() > HeaderTop ) {
  7. $('#headermenu').css({position: 'fixed', width: '100%',left: '0%',margin: '0px 0px 10px 0px', top: '0px'});
  8. } else {
  9. $('#headermenu').css({position: 'static'});
  10. }
  11. });
  12. });
  13. </script>
ну и для меню задал — id="headermenu"
и после этого если стоит слайдер то неработало., а если убрать слайдер то работало, и если установвить скрип от вконтакте -Работало вместе со слайдером!!! как то так!)) можеть я что то не правильно делал?
#10 22 февраля 2015 в 20:12
Зачем явой загрузил… Прописал в css и все…
#11 24 февраля 2015 в 05:17
wayfox, подскажите пожалуйста как это правильно прописать!!! что бы для меню был один стиль, а когда скролинг то другой стиль!!!
#12 24 февраля 2015 в 21:14
в конце ..\templates\default\main.tpl.php вставьте:
  1. <script type="text/javascript">
  2. $(function(){
  3. $(window).scroll(function() {
  4. var top = $(document).scrollTop();
  5. var wd = $("#layout").outerWidth();
  6. if (top < 50) $("nav").css({top: '0', width: '', position: 'relative', 'z-index': ''});
  7. else $("nav").css({top: '0', width: wd+'px', position: 'fixed', 'z-index': '100'});
  8. });
  9. });
  10. </script>
p.s. код для дефолтного шаблона
p.p.s. есть один незначительный недостаток)) — при фиксировании меню есть скачок когда тело страницы прыгает вверх на 50px (высота меню) — решается добавлением сначала нового блока с высотой 50px, потом присвоение стилей для меню, и назад в обратном порядке.
#13 25 февраля 2015 в 11:27
а без скрипта не как, чтобы в стилях прописать только ??? выше я выкладывал как я делал, то же самое вы написали!!!
#14 25 февраля 2015 в 14:26

Ребята подскажите как в дефолтном шаблоне в 2, зафиксировать главное меню, что бы при скролле оно оставалось вверху!??

vsemkrot

без скрипта не как, чтобы в стилях прописать только ???

vsemkrot
При скролинге без скрипта никак)) Существующие возможные варианты CSS для скролла не поддерживается всеми браузерами.
#15 26 февраля 2015 в 03:21
Val, а как зафиксировать верхнее меню (для дефолтного шаблона) вместе с картинкой (логотипом), если не сложно?
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.