0 Пользователей и 1 Гость просматривают эту тему.
  • 6 Ответов
  • 11538 Просмотров
*

Repear

  • Новичок
  • 3
  • 0 / 0
Как зафиксировать шапку
« : 22.09.2010, 16:51:47 »
Доброго времени суток!
Простой сайт на основе шаблона Шапка-меню-статьи
Необходимо зафиксировать шапку вместе с горизонтальным меню т.е.чтобы скролились только статьи Не могу найти в каком направление копать толи искать шаблон в котором есть эти свойства то ли модуль... инет перерыл и понял что не знаю что именно искать..толкните пожалуйста в правильном направлении
*

danik.html

  • Живу я здесь
  • 2650
  • 353 / 4
Re: Как зафиксировать шапку
« Ответ #1 : 22.09.2010, 17:48:37 »
Код: css
.header{
    position: fixed;
}
【Мегапак Virtuemart:
 • метатеги (description,keywords)
 • заголовки (title)
 • красивые алиасы (чпу) без тормозов и дублей!
*

Repear

  • Новичок
  • 3
  • 0 / 0
Re: Как зафиксировать шапку
« Ответ #2 : 22.09.2010, 20:46:10 »
Меня интересует именно при использовании шаблонов , вот например
HTML файла шаблона :
<!--Begin Header-->
            <?php if ($show_logo == "true" or $this->countModules('logo') or $this->countModules('search')) : ?>
            <div id="header-bar">
               <?php if ($this->countModules('logo')) : ?>
               <div class="logo-module"><jdoc:include type="modules" name="logo" style="xhtml" /></div>
               <?php elseif ($show_logo == "true") : ?>
               <a href="<?php echo $this->baseurl; ?>" id="logo">
                  <?php if ($show_logo_slogan == "true") : ?>
                  <span class="logo-text"><?php echo $logo_slogan; ?></span>
                  <?php endif; ?>
               </a>
               <?php endif; ?>
               <?php if ($this->countModules('search')) : ?>
               <jdoc:include type="modules" name="search" style="search" />
               <?php endif; ?>
            </div>
            <?php endif; ?>
            <?php if($mtype != "none") : ?>
            <div id="horiz-menu" class="<?php echo $mtype; ?>">
            <?php if($mtype != "module") : ?>
               <?php echo $topnav; ?>
            <?php else: ?>
               <jdoc:include type="modules" name="toolbar" style="none" />
            <?php endif; ?>
            <div class="clr"></div>
            </div>
            <?php endif; ?>
            <!--End Header-->
А вот css
#header-bar {position: fixed;background: #305086 url(../images/header/blue/header-bg.png) 0 0 repeat-x;}
#logo {background: url(../images/header/blue/logo.png) 0 0 no-repeat;}

position: fixed Вставлено тогда шапка получается зафиксированной но все остальное т.е статьи, левое меню  поднимаются до верхней границы окна поверх (или за шапкой)...
*

danik.html

  • Живу я здесь
  • 2650
  • 353 / 4
Re: Как зафиксировать шапку
« Ответ #3 : 22.09.2010, 21:02:57 »
блоки с position: fixed выпадают их потока, верно. сделайте отступ идущим ниже блокам чтобы не залазили под шапку
.content{
     margin-top: 200px;
}
или padding-top, потому что марджин может схлопнуться с марджином родителя (если у него нет border, padding или overflow: hidden). чтоб шабка была поверх контента поставьте ей z-index поболя
【Мегапак Virtuemart:
 • метатеги (description,keywords)
 • заголовки (title)
 • красивые алиасы (чпу) без тормозов и дублей!
*

danik.html

  • Живу я здесь
  • 2650
  • 353 / 4
Re: Как зафиксировать шапку
« Ответ #4 : 22.09.2010, 21:07:20 »
а еще лучше будет задать родителю(обычно body) padding-top: 200px, шапке position:fixed, top: 0, left: 0, а content не трогать.
контент будет где нужно благодаря padding'у родителя, а шапка встанет какраз поверх этого паддинга.
【Мегапак Virtuemart:
 • метатеги (description,keywords)
 • заголовки (title)
 • красивые алиасы (чпу) без тормозов и дублей!
*

Repear

  • Новичок
  • 3
  • 0 / 0
Re: Как зафиксировать шапку
« Ответ #5 : 22.09.2010, 22:46:47 »
Спасибо, разобрался все получилось... а можно как то меню зафиксировать чтоб только контент скролился или наоборот какое нибудь меню (левое, правое...) т.е. один столбец в боди
или это не возможно

css
Код
#body-left {background: url(../images/body/beige/body-l.png) 0 0 repeat-y;}
#body-right {background: url(../images/body/beige/body-r.png) 100% 0 repeat-y;}

#main-body ul.menu li {background: #F6F6E9;}
#main-body ul.menu li a {background: url(../images/modules/beige-arrow.png) 10px 10px no-repeat;}
#main-body ul.menu li.active, #main-body ul.menu li:hover {background: #BEBBA7 url(../images/modules/darkbeige-module-h3-2.png) 10px 0 repeat-x;}
#main-body ul.menu li.active.parent li span, #main-body ul.menu li.parent li span {background: url(../images/body/beige/beige-side-sub-bullet.png) 0 0 no-repeat;}
Если что нить зафиксировать то фиксируется все причем остальные столбцы расплываются :-((
*

terr

  • Давно я тут
  • 824
  • 14 / 6
  • Ученик html-я
Re: Как зафиксировать шапку
« Ответ #6 : 03.03.2011, 10:42:16 »
все ети модули каторые у тебя в индексе на них есть ксс, всем позицию фиксируеш настраиваеш выравниваеш и все робит
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Как зафиксировать шапку?

Автор GromoOtVot

Ответов: 1
Просмотров: 1345
Последний ответ 30.03.2015, 19:27:24
от GromoOtVot
Не могу убрать баннер, и прижать шапку влево

Автор Adrenaline

Ответов: 6
Просмотров: 1869
Последний ответ 11.09.2014, 21:11:31
от midav
Часы в шапку сайта

Автор ezanich

Ответов: 4
Просмотров: 2385
Последний ответ 26.07.2013, 12:11:53
от darkghost
Изменить шапку сайта

Автор LeniviKot

Ответов: 1
Просмотров: 1585
Последний ответ 03.05.2012, 10:57:20
от Aleks_El_Dia
Опера обрезает шапку. Проблема с CSS.

Автор ice-den

Ответов: 14
Просмотров: 2716
Последний ответ 13.02.2012, 19:16:54
от ice-den