Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.

боковое меню! Fdf10
С нашей помощью вы можете создать форум,
похожий на этот!
Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.

боковое меню! Fdf10
С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях
Важная информация!

Правила форума

для обязательного прочтения!

Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.

Я админ, не могу зайти!
(забыл / потерял пароль)


Общий FAQ по управлению форумом

FAQ: реклама на форуме

Туториалы по разным функциям ваших форумов

Алфавитный указатель

Интересные решения для форумов

Наши видео-туториалы

Условия пользования сервисом

Ссылки на полезные ресурсы

Последние темы
» ВПН
автор Danny_Marcelo Сегодня в 07:47

» Пропала вкладка "Обработка пользователей"
автор Svet007 Вчера в 07:39

» Как найти администратора?
автор PushPayer Ноябрь 21st 2024, 00:58

» Не корректное отображение картинок
автор VENEFICA. Ноябрь 15th 2024, 14:46

» Не меняется название форума
автор Aviator Ноябрь 14th 2024, 15:40

» Дублируется ссылка на форум в боковом меню
автор Чистый сталкер Октябрь 26th 2024, 21:13

» совет админам
автор лексей2222 Октябрь 23rd 2024, 05:45

» Проблема с гугл из-за Hitskin
автор Вултур Октябрь 21st 2024, 15:43

» [решено]Редактирвоание темы
автор AlexDarkTech Октябрь 13th 2024, 08:14

» Пропали иконки редактирования - HEEELP
автор Archaea Сентябрь 23rd 2024, 18:11

боковое меню!

Участников: 2

Перейти вниз

Решено боковое меню!

Сообщение автор ryslik2010 Январь 19th 2010, 15:15

Понадобилось боковое меню в столбик и чтобы ссылки раскрывались flag Пожалуйста, дайте код! 13
ryslik2010
ryslik2010
 

Мужчина

Сообщения : 144
Возраст : 29
Регистрация : 2009-03-30
Благодарности : 16

Без предупреждений

https://www.habbolifeforum.com/

Вернуться к началу Перейти вниз

Решено Re: боковое меню!

Сообщение автор Dana Domirani Январь 19th 2010, 16:15

Боковое — это какое именно? Для виджета, для html-страницы? С раскрывающимися подпунктами?

Могу предложить как вариант:

боковое меню! Image_33

Разместите там, где Вам нужно меню, этот код:

Код:
<ul class="vertmenu">
    <li><a href="#">Пункт 1</a></li>
    <li><a href="#top">Пункт 2 ></a>
        <ul>
            <li><a href="#">подпункт 2.1</a></li>
            <li><a href="#">подпункт 2.2</a></li>
            <li><a href="#">подпункт 2.3</a></li>
        </ul>
    </li>
    <li><a href="#">Пункт 3</a></li>
    <li><a href="#">Пункт 4</a></li>
    <li><a href="#">Пункт 5</a></li>
    <li><a href="#">Пункт 6</a></li>
</ul>

<style type="text/css">

/* настройки основного блока */

ul.vertmenu {
   margin: 1px !important;
   padding: 0 !important;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   display: inline-block;
   background-color: #3d3e40; /* цвет фон меню */
   width: 190px; /* ширина меню */
}

ul.vertmenu li {
   list-style: none;
   position: relative;
}

ul.vertmenu li a {
   padding: 10px 12px 12px;
   color: #fff; /* цвет ссылок пунктов */
   font-size: 13px;
   font-weight: bold;
   font-family: Arial;
   text-decoration: none;
   display: block;
   border-top: 1px solid #c4c4c4; /* разделительная линия между пунктами */
}

ul.vertmenu li a:hover {
   background-color: #b00000; /* цвет фона пунктов и подпунктов при наведении */
}

ul.vertmenu li:first-child a {
   border-top: none;
}

ul.vertmenu li:first-child a:hover {
   border-radius: 5px 5px 0 0;
   -webkit-border-radius: 5px 5px 0 0;
   -moz-border-radius: 5px 5px 0 0;
}

ul.vertmenu li:last-child a:hover {
   border-radius: 0 0 5px 5px;
   -webkit-border-radius: 0 0 5px 5px;
   -moz-border-radius: 0 0 5px 5px;
}

/* Выпадающее подменю */

ul.vertmenu li ul {
   display: none;
}

ul.vertmenu li:hover ul {
   display: block;
   position: absolute;
   left: 190px;
   top: 1px;
   padding-left: 0 !important;
   margin: 0 !important;
   background-color: #28282a; /* цвет фона подпункта */
   width: 150px !important; /* ширина подпунктов */
   z-index: 10000;
   border-radius: 0 5px 5px 0;
   -webkit-border-radius: 0 5px 5px 0;
   -moz-border-radius: 0 5px 5px 0;
}

ul.vertmenu li:hover ul li:first-child a:hover {
   border-radius: 0 5px 0 0;
   -webkit-border-radius: 0 5px 0 0;
   -moz-border-radius: 0 5px 0 0;
}

ul.vertmenu li:hover ul li:last-child a:hover {
   border-radius: 0 0 5px 0;
   -webkit-border-radius: 0 0 5px 0;
   -moz-border-radius: 0 0 5px 0;
}
</style>

Можете убрать / добавить любое количество пунктов и подпунктов.

Строка вида

    Код:
    <li><a href="#">Пункт 6</a></li>

— это обычный пункт (строка со ссылкой)

Строка вида

    Код:
    <li><a href="#top">Пункт 2 ></a>
            <ul>
                <li><a href="#">подпункт 2.1</a></li>
                <li><a href="#">подпункт 2.2</a></li>
                <li><a href="#">подпункт 2.3</a></li>
            </ul>
    </li>

— это пункт с раскрывающимся при наведении списком подпунктов (не обязательно ссылок, там может быть просто текст или картинки)

1) Замените текст пунктов и подпунктов, например:

    Код:
    <li><a href="#">Пункт 1</a></li>
    на
    Код:
    <li><a href="#">Список статей</a></li>

2) Замените значки # на ссылки, например:

    Код:
    <li><a href="#">Пункт 1</a></li>
    на
    Код:
    <li><a href="http://help.forum2x2.ru/">Пункт 1</a></li>

3) В настройках стилей (они находятся сразу под кодом меню) замените параметры цвета, размеров и пр. на те, которые подходят Вашему форуму / странице. Например, чтобы сделать меню не серым, а оранжевым, замените

    Код:
    background-color: #3d3e40; /* цвет фон меню */
    на
    Код:
    background-color: #ff9933; /* цвет фон меню */


P.S. если захотите поставить его в левый виджет, то для корректного отображения меню придется добавить в CSS:
Для Pun, BB3 и IPB
Код:
#content-container div#left, #left .main-content, .module {overflow: visible !important}


боковое меню! Userba12

Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript


Dana Domirani
Dana Domirani
Администратор
Администратор

Женщина

Сообщения : 22996
Возраст : 39
Регистрация : 2008-04-18
Благодарности : 9286

Без предупреждений

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Вернуться к началу

- Похожие темы

 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения