Забыли пароль?
Запросите новый здесь.

Автор темы: noname
ID темы: 2260
Информация:
Тема содержит 15 сообщения, была просмотрена 13106 раз.  Имеются прикрепленные файлы.
Просмотр темы
PHP-Fusion Russia » Поддержка 7 версии » Ошибки, баги
 Распечатать тему
Вертикальное выпадающее меню
noname
Добрый день!

Сайте php-fusion 7.02.07, тема Style пытаюсь реализовать вертикальное выпадающее меню в левой панели.

Вставляю в файл style.css следующее:
Скачать исходники  Код
ul.secondary-menu {
margin: 0;
padding: 0;
display: inline-block;
width: 200px;
}
ul.secondary-menu li {
background: #333333;
background: linear-gradient(#222222, #444444);
list-style: none;
position: relative;
}
ul.secondary-menu li a {
padding: 10px;
display: block;
border-top: 1px solid #DDDDDD;
border-right: 1px solid #DDDDDD;
font-family: sans-serif;
font-size: 13px;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
ul.secondary-menu li a:hover,
ul.secondary-menu li:hover > a {
background: #006699;
}
ul.secondary-menu li ul,
ul.secondary-menu li ul.sub-menu li ul {
margin: 0;
padding: 0;
display: none;
}
ul.secondary-menu li:hover ul,
ul.secondary-menu li ul.sub-menu li:hover ul {
left: 200px;
top: 0px;
width: 200px;
display: block;
position: absolute;
z-index: 100;
}




В левую панель я вставляю следующее:

Скачать исходники  Код
<ul class="secondary-menu">
<li><a href=" ">Раздел 1</a>
<ul class="sub-menu">
<li><a href=" ">Раздел 1.1</a>
<ul class="sub-menu">
<li><a href=" ">Раздел 1.1.1</a></li>
<li><a href=" ">Раздел 1.1.2</a></li>
</ul>
</li>
<li><a href=" ">Раздел 1.2</a></li>
<li><a href=" ">Раздел 1.3</a></li>
</ul>
</li>
<li><a href=" ">Раздел 2</a></li>
<li><a href=" ">Раздел 3</a></li>
</ul>




Нажимаю предварительный просмотр все работает! Сохраняю захожу на главную, меню есть но подменю почему-то не открывается. Подскажите, что нужно поправить, что я делаю не так?
 
jikaka
скорее всего конфликт скриптов
тема чистая? или есть дополнения?
 
Web
lucky
возможно, у блока-родителя в которое вставлено меню есть типа такого свойства *overflow: hidden;*

попробуйте выплывающему списку отступ поменьше сделать:
Скачать исходники  Код
ul.secondary-menu li:hover ul,
ul.secondary-menu li ul.sub-menu li:hover ul {
left: 100px;
top: 0px;
width: 200px;
display: block;
position: absolute;
z-index: 100;
}




если он будет виден на половину и обрезаться по край боковой панели, значит точно *overflow: hidden;* виноват)

всё что выходит за его пределы он скрывает, чё делать? не знаю, можно убрать это свойство но есть риск что шаблон развалится, наверное, придётся переделывать вёрстку шаблона
 
noname
Помогло, теперь только он отображает ячейки внутри панели. Как их вывести за пределы?

lucky написал:

возможно, у блока-родителя в которое вставлено меню есть типа такого свойства *overflow: hidden;*

попробуйте выплывающему списку отступ поменьше сделать:
Скачать исходники  Код
ul.secondary-menu li:hover ul,
ul.secondary-menu li ul.sub-menu li:hover ul {
left: 100px;
top: 0px;
width: 200px;
display: block;
position: absolute;
z-index: 100;
}




если он будет виден на половину и обрезаться по край боковой панели, значит точно *overflow: hidden;* виноват)

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


Объединено 08.07.2014 09:03:
Проблема решена:
Скачать исходники  Код

ul.secondary-menu li:hover ul,
ul.secondary-menu li ul.sub-menu li:hover ul {
left: 100px;
top: 10px;
width: 200px;
display: block;
position: fixed;
z-index: 100;
top: 30%;
bottom: 30%;
right: 10%;
left: 10%;
}



noname присоединено следующее:изображения:
1404805359.jpg 3243242342.jpg

Изменил(а) noname, 08.07.2014 09:03
 
lucky
Помогло, теперь только он отображает ячейки внутри панели. Как их вывести за пределы?


пока у родительского блока задан *overflow: hidden;* никак, на то оно и дано чтобы всё скрывать)

переделывать вёрстку шаблона надо, может быть всего-то хватить это свойство отменить, а может и пол дня провозишься,

обычно как - устраняешь одну проблему появляется другая, потому что шаблон делали под одну а ты ему другое суёшь
x1
 
noname
Есть какой нибудь палагин с вертикально выпадающим меню, реально работающий?
 
jikaka
есть вот такой
http://rusfusion....mod_id=689
 
Web
Polarfox
У меня работающий на CSS но левая панель, все никак не сделаю правую.
Диз выпадающих можно допилить под себя, сейчас универсальный стоит.
Всегда делайте backup перед изменениями | Указывайте свою версию в подписи/профиле. | Вся бесплатная тех. поддержка только на форуме

PolarLab - вход для подопытных
 
Web
noname
Это горизонтальныйab

 
jikaka
ох, прошу прощения
тогда у Леши есть вертикальный вариант, хотя он уже об этом написал
 
Web
noname
Алексей, не могли бы Вы поделиться своим палагином?

PolarFox написал:

У меня работающий на CSS но левая панель, все никак не сделаю правую.
Диз выпадающих можно допилить под себя, сейчас универсальный стоит.
 
jikaka
как вариант поиск по нашей базе
http://rusfusion....p;chars=50
 
Web
Polarfox
noname, персонально делюсь (Скрытый текст: (больше никто не имеет возможности скачать)) http://unlogic.in...ead_id=236

там немного сложно создавать субменю, зато ПОЛНАЯ совместимость в оригинальным меню (мне просто не хотелось делать перетаскивание в админке)
Всегда делайте backup перед изменениями | Указывайте свою версию в подписи/профиле. | Вся бесплатная тех. поддержка только на форуме

PolarLab - вход для подопытных
 
Web
noname
Офигеть! Как этим пользоваться. ab Чумовая штуковина
Изменил(а) noname, 09.07.2014 11:32
 
Polarfox
Инструкция там же, уже три версии не меняется (да - их три версии, но те неуд по моему имхо)
Бонусом картинки в меню идут, ради них все и затевалось.
Всегда делайте backup перед изменениями | Указывайте свою версию в подписи/профиле. | Вся бесплатная тех. поддержка только на форуме

PolarLab - вход для подопытных
 
Web

Поделиться этой темой
Социальные закладки: Vkontakte Odnoklassniki Mail.ru Facebook Google Tweet This
URL:
BBcode:
HTML:

Перейти на форум: