Форум русской поддержки Joomla!® CMS
10.12.2016, 09:03:36 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Будьте добры помочь с фиксацией меню на сайте

 (Прочитано 345 раз)
0 Пользователей и 1 Гость смотрят эту тему.
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« : 27.02.2016, 17:47:07 »

Прочитал одну из ваших тем "Фиксированное горизонтальное меню Joomla 2.5" и решил установить  на сайте. Все зафиксировал.Но проблема в том, что и все пункты меню выровнялись в верхнем левом углу. Кто может помочь? Вот стиль.ксс.
Код:
.sj-flat-menu {
background-color:#FFF;
text-align:left;
border: 1px solid #72d7ff;
}

ul.sj-flat-menu ,
ul.sj-flat-menu ul {
list-style:none ;
margin:0;
padding:0;
}

.sj-flat-menu     li{
background-color: rgba(112, 168, 0, 0.15);
padding-left:5px;
cursor: pointer;
border-bottom: 1px solid #70a800;
}

.sj-flat-menu .fm-item:hover a,
.sj-flat-menu li.fm-active > .fm-item a{
color: #FFFFFF;
    outline-style: style-line;
    border: none;
}

.sj-flat-menu li .fm-item .fm-link {
padding-left:5px;
position:relative;
display: block;
    margin-right: 25px;
}

.flyout-menu  li ul{
background: none repeat scroll 0 0 #121212;
    border: 1px solid #72d7ff;
    margin: 0;
    padding: 0;
    min-width: 200px;
}

.sj-flat-menu  li ul li .fm-item a {
padding-left: 26px;
background : url(../images/icon_dot.png) no-repeat left center;
display:inline-block;
    background-size: 6px;
}

.sj-flat-menu li .fm-item .fm-button {
width: 16px;
height: 18px;
margin: 0;
overflow: hidden;
    position:absolute;
right:3px;
top:50%;
margin-top:-10px;
}

.sj-flat-menu > li .fm-item{
position:relative;
}

.sj-flat-menu > li .fm-item a {
font-weight: bold;
    color: #ffffff;
    line-height: 26px;
    outline: none;
}

.sj-flat-menu  a img {
vertical-align:middle;
border: 0 none;
    height: auto;
    max-width: 32px;
width:32px;
padding:0 5px 0 0;

}
.sj-flat-menu  li.fm-last,
.sj-flat-menu  li ul li.fm-last{
    border: 0;
}

.flyout-menu  li .fm-container{
position: absolute;
    top: -1px;
display: none;
z-index: 1000;
padding:0;
}

.flyout-menu > li{
position: fixed;
z-index: 99;
top: 0%; 
right: 0%; 
left: 0%;
}

.flyout-menu  li li{
position: relative;
}

.flyout-menu.horizontal{
width:100%;
}
Записан
effrit
Группа развития
*****

Репутация: +733/-7
Offline Offline

Пол: Мужской
Сообщений: 6824


effrit.com


« Ответ #1 : 27.02.2016, 17:50:41 »

ссылку на сайт давайте, кто вам будет в уме код отрисовывать?
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #2 : 27.02.2016, 17:57:08 »

ссылку на сайт давайте, кто вам будет в уме код отрисовывать?
http://www.shvidkadopomoga.co.ua/
Записан
effrit
Группа развития
*****

Репутация: +733/-7
Offline Offline

Пол: Мужской
Сообщений: 6824


effrit.com


« Ответ #3 : 27.02.2016, 18:04:23 »

добавить
Код:
#block-toolbar {
    position: fixed;
    width: 100%;
    z-index: 10;
}


исправить
Код:
.flyout-menu > li {
    position: fixed;  - УБРАТЬ
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #4 : 27.02.2016, 18:08:19 »

добавить
Код:
#block-toolbar {
    position: fixed;
    width: 100%;
    z-index: 10;
}


исправить
Код:
.flyout-menu > li {
    position: fixed;  - УБРАТЬ
Это все встиль.ксс?
Записан
effrit
Группа развития
*****

Репутация: +733/-7
Offline Offline

Пол: Мужской
Сообщений: 6824


effrit.com


« Ответ #5 : 27.02.2016, 18:12:58 »

нет. это - тайное послание в Альфа-Центавру.
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #6 : 27.02.2016, 18:22:28 »

нет. это - тайное послание в Альфа-Центавру.

спасибо друг!
нет. это - тайное послание в Альфа-Центавру.

Спасибо друг! А как его теперь растянуть на всю ширину страницы? Добавить width:100%;
Записан
effrit
Группа развития
*****

Репутация: +733/-7
Offline Offline

Пол: Мужской
Сообщений: 6824


effrit.com


« Ответ #7 : 27.02.2016, 18:34:24 »

layout.css - убрать float у #search
+ сделать весь фон верхней полосы зеленым
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #8 : 27.02.2016, 18:35:59 »

layout.css - убрать float у #search
+ сделать весь фон верхней полосы зеленым
Я понял.Но почему-то ссулки в меню не работают.
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #9 : 27.02.2016, 18:40:30 »

layout.css - убрать float у #search
+ сделать весь фон верхней полосы зеленым
Спасибо с ссылками разобрался! Сейчас попробую с Фоном!
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #10 : 27.02.2016, 20:00:34 »

Спасибо огромное! Как + поставить тебе, друг?
Записан
effrit
Группа развития
*****

Репутация: +733/-7
Offline Offline

Пол: Мужской
Сообщений: 6824


effrit.com


« Ответ #11 : 27.02.2016, 20:05:49 »

набрать 10 сообщений, чтобы можно было плюсовать ).
но более ценно будет помочь кому-нибудь из местных вопрошающих ).
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #12 : 27.02.2016, 20:31:03 »

набрать 10 сообщений, чтобы можно было плюсовать ).
но более ценно будет помочь кому-нибудь из местных вопрошающих ).
Спасибо!Буду пробовать.
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #13 : 27.02.2016, 20:33:54 »

набрать 10 сообщений, чтобы можно было плюсовать ).
но более ценно будет помочь кому-нибудь из местных вопрошающих ).
А может еще подскажешь. Как сделать, что бы это меню не пропадало при сжатом виде окна, а то на мобильном оно пропадает.
Записан
effrit
Группа развития
*****

Репутация: +733/-7
Offline Offline

Пол: Мужской
Сообщений: 6824


effrit.com


« Ответ #14 : 27.02.2016, 21:04:22 »

ну по идее можно жестко попробовать прописать
Код:
#toolbar {
 display:block !important;
}
но тогда надо будет условие для меню писать, чтобы оно откреплялось на мобильном виде, иначе каша будет.
изучай CSS @media, а шаблоны бери по-проще, чтобы понимать, что там происходит )
Записан
mazim
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 25


« Ответ #15 : 27.02.2016, 21:12:51 »

ну по идее можно жестко попробовать прописать
Код:
#toolbar {
 display:block !important;
}
но тогда надо будет условие для меню писать, чтобы оно откреплялось на мобильном виде, иначе каша будет.
изучай CSS @media, а шаблоны бери по-проще, чтобы понимать, что там происходит )
Спасибо! Буду пробовать.
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet