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

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

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

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

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

Правила форума
для обязательного прочтения!

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

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

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

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

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

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

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

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

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

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

Ссылки на полезные ресурсы
Последние темы
» Как поменять вид нумерации страниц тем?
автор Goodmonday Апрель 18th 2024, 21:04

» Форум не корректно загружается.
автор anna4842 Апрель 12th 2024, 23:48

» Не корректное отображение картинок
автор Красноперова О.А. Апрель 12th 2024, 15:49

» Ошибка на форуме: Could not obtain topic posts informations
автор fatalone Апрель 9th 2024, 13:43

» Переход с 2x2forum.ru на 2x2forum.com
автор Luz Март 28th 2024, 12:13

» Проблема с метатегом Description
автор VeraLV Март 18th 2024, 15:31

» 1 марта будет запрет на ВПН, это отразится на работе платформы?
автор Svet007 Март 14th 2024, 11:43

» нужен скрипт сумма просмотров тем в разделе
автор лексей2222 Март 5th 2024, 07:37

» Новое: Откройте для себя функцию "Подписка на пользователей"
автор лексей2222 Март 1st 2024, 17:26

» 301 редирект
автор Dana Domirani Февраль 25th 2024, 18:28

Видео-туториалы
Настройка шапки форума
Категории и подфорумы - 1
Создание портала
Модули
Виджеты
Как присваивать награды
Выброс кубиков
Pop-up для входа на форум
Настроение в профиле

Выпадающее меню

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

Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Оформление вашего форума :: [Архив] Оформление форума

Страница 2 из 2 • Предыдущий  1, 2

Перейти вниз

Выпадающее меню - Страница 2 Empty Выпадающее меню

Сообщение автор kpripper Январь 22nd 2011, 16:03

Первое сообщение в теме :

В который раз поднимается эта тема на форуме. Прочитал все что нашел в поиске.

Пробовал сделать как описано здесь

Там на тесте примерно как я хочу, у меня меню остается в левом виджете. Изменил версию на PunBB, не помогло, только внешний вид поправился.
avatar
kpripper
 

Мужчина

Сообщения : 437
Возраст : 40
Регистрация : 2009-08-06
Благодарности : 5

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

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

Выпадающее меню - Страница 2 Empty Re: Выпадающее меню

Сообщение автор kpripper Январь 25th 2011, 13:39

Погуглил, нашел неплохую штуку http://www.lwis.net/free-css-drop-down-menu/ но тоже не все понятно.
Вроде вставляю css в css , html в html, загружаю картинки на радикал, ссылки вставляю в код, но все равно выходит не то, что должно быть.


Последний раз редактировалось: kpripper (Январь 25th 2011, 15:43), всего редактировалось 1 раз(а)

kpripper
 

Сообщения : 437
Регистрация : 2009-08-06

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

Выпадающее меню - Страница 2 Empty Re: Выпадающее меню

Сообщение автор Sunnyta Январь 25th 2011, 14:14

Код:
<ul id="sn_menu">
        <li class="sub"><a href="ССЫЛКА">Форум</a>
                <ul>
                        <li class="sub"><a href="ССЫЛКА">Канцелярия</a>
                                <ul>
                                        <li><a href="ССЫЛКА">Онлайн тесты</a></li>
                                </ul>
                        </li>
                        <li><a href="ССЫЛКА">Уроки HTML</a></li>
                        <li class="sub"><a href="ССЫЛКА">Уроки CSS</a>
                                <ul>
                                        <li><a href="ССЫЛКА">Фон страницы</a></li>
                                        <li><a href="ССЫЛКА">Позиционирование элементов</a></li>
                                        <li><a href="ССЫЛКА">Оформление текста</a></li>
                                </ul>
                        </li>
                </ul>
        </li>
        <li><a href="ССЫЛКА">Хостинг картинок</a></li>
</ul>
<script type="text/javascript">
<!--
// Copyright SiteNull.ru
menu = document.getElementById("sn_menu");
lists = menu.getElementsByTagName("ul");
for(i=0; i<lists.length; i++){
        if(lists[i].parentNode.className == "sub"){
                lists[i].style.display = "none";
                lists[i].parentNode.onmouseover = function(){
                        sublists = this.getElementsByTagName("ul")[0];
                        if(sublists.style.display == "none"){
                                        sublists.style.display = "block";
                                        sublists.style.width = "180px";
                                        http://sublists.style.left = sublists.parentNode.style.left+sublists.parentNode.offsetWidth+"px";
                                        sublists.style.zIndex = this.style.zIndex+2;
                        }
                }
                lists[i].parentNode.onmouseout = function(){
                        sublists = this.getElementsByTagName("ul")[0];
                        if(sublists.style.display == "block"){
                                        sublists.style.display = "none";
                        }
                }
        }
}
//-->
</script>

Этот код в верхний виджет или в шаблон ...
*СИСС прописать какой вам необходимо
Sunnyta
Sunnyta
 

Сообщения : 1577
Регистрация : 2008-03-20
Благодарности : 63

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

http://www.sun-place.com/

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

Выпадающее меню - Страница 2 Empty Re: Выпадающее меню

Сообщение автор kpripper Январь 25th 2011, 18:00

Спасибо за помощь. Пытаюсь установить такое меню
http://www.lwis.net/free-css-drop-down-menu/dropdown.flickr.com.horizontal.html
Вот что выходит http://surgeryzonetest.the-talk.net/ , все работает, только стрелки не меняют цвет при наведении, как в примере, причем в CSS я не нахожу ссылок на эти картинки.

Может кто-то их добавить ?
avatar
kpripper
 

Мужчина

Сообщения : 437
Возраст : 40
Регистрация : 2009-08-06
Благодарности : 5

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

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

Выпадающее меню - Страница 2 Empty Re: Выпадающее меню

Сообщение автор kpripper Январь 25th 2011, 18:18

Разобрался вроде , этот цсс полный кошмар.
avatar
kpripper
 

Мужчина

Сообщения : 437
Возраст : 40
Регистрация : 2009-08-06
Благодарности : 5

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

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

Выпадающее меню - Страница 2 Empty Re: Выпадающее меню

Сообщение автор Sunnyta Январь 25th 2011, 19:22

Хорошо получилось! girl_yes
может код выложите?
Sunnyta
Sunnyta
 

Сообщения : 1577
Регистрация : 2008-03-20
Благодарности : 63

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

http://www.sun-place.com/

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

Выпадающее меню - Страница 2 Empty Re: Выпадающее меню

Сообщение автор kpripper Январь 25th 2011, 23:13

Рад был бы, но произошла непонятная хрень - в разделе оформление нет шаблонов, бобик второй ! scratch
avatar
kpripper
 

Мужчина

Сообщения : 437
Возраст : 40
Регистрация : 2009-08-06
Благодарности : 5

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

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

Выпадающее меню - Страница 2 Empty Re: Выпадающее меню

Сообщение автор kpripper Январь 25th 2011, 23:54

Посмотреть можно здесь http://www.surgeryzone.net/
Код с мусором, но после нескольких дней экспериментов уже лень чистить, главное что выглядит нормально.

Это в шаблон верха
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta name="keywords" content=" css, dropdowns, dropdown menu, drop-down, menu, navigation, nav, horizontal, vertical left-to-right, vertical right-to-left, horizontal linear, horizontal upwards, cross browser, internet explorer, ie, firefox, safari, opera, browser, lwis" />
<meta name="description" content="Clean, standards-friendly, modular framework for dropdown menus" />
<link href="css/dropdown/themes/flickr.com/helper.css" media="screen" rel="stylesheet" type="text/css" />

<!-- Beginning of compulsory code below -->

<link href="css/dropdown/dropdown.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/dropdown/themes/flickr.com/default.ultimate.css" media="screen" rel="stylesheet" type="text/css" />

<!--[if lt IE 7]>
<script type="text/javascript" src="js/jquery/jquery.js"></script>
<script type="text/javascript" src="js/jquery/jquery.dropdown.js"></script>
<![endif]-->

<!-- / END -->

</head>
<body>

<!-- Beginning of compulsory code below -->

<ul id="nav" class="dropdown dropdown-horizontal">

   <li><span class="dir">Форум</span>
      <ul>
         <li><a href="http://www.surgeryzone.net/">Главная</a></li>
         <li><a href="http://www.surgeryzone.net/portal">Последние темы</a></li>
         <li><a href="./">Поиск</a></li>
            <ul>
               <li><a href="http://www.google.ru/advanced_search">Поиск Google</a></li>
               <li><a href="http://www.surgeryzone.net/search">Поиск форума</a></li>
                              </ul>

         <li class="divider"><a href="./">...</a></li>
      </ul>
   </li>

</ul>

<!-- / END -->

</body>
</html>


Это в CSS
Код:
@charset "UTF-8";


ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
 list-style: none;
 margin: 0;
 padding: 0;
}

ul.dropdown {
 position: relative;
 z-index: 999;
 float: left;
}

ul.dropdown li {
 float: left;
 line-height: 1.3em;
 vertical-align: middle;
 zoom: 1;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
 position: relative;
 z-index: 999;
 cursor: default;
}

ul.dropdown ul {
 visibility: hidden;
 position: absolute;
 top: 100%;
 left: 0;
 z-index: 999;
 width: 100%;
}

ul.dropdown ul li {
 float: none;
}

ul.dropdown ul ul {
 top: 1px;
 left: 99%;
}

ul.dropdown li:hover > ul {
 visibility: visible;
}
@charset "UTF-8";

/**
 * Flickr CSS Drop-Down Menu Theme
 *
 * @file      default.css
 * @name      Flickr
 * @version      beta
 * @type      transitional
 * @browsers   Windows: IE5+, Opera7+, Firefox1+
 *            Mac OS: Safari2+, Firefox2+
 *
 *
 */


/*-------------------------------------------------/
 * @section      Base Drop-Down Styling
 * @structure   ul (unordered list)
 *            ul li (list item)
 *            ul li a (links)
 *            /*\.class|(li|a):hover/
 * @level sep   ul
 */


ul.dropdown {
 padding-bottom: 1px;
 background: url(http://i063.radikal.ru/1101/7c/c3e6bf0ca3ed.png) 0 100% repeat-x;
 font: bold 13px/normal Arial, Helvetica, sans-serif;
}

   ul.dropdown li {
    padding: 4px 6px;
    color: #0063dc;
   }

   ul.dropdown li.divider {
    border-top: solid 1px #e5e5e5;
   }

   ul.dropdown li.hover,
   ul.dropdown li:hover {
    color: #0063dc;
   }

   ul.dropdown a:link,
   ul.dropdown a:visited   { color: #0063dc; text-decoration: none; }
   ul.dropdown a:hover      { color: #0063dc; text-decoration: underline; }
   ul.dropdown a:active   { color: #ff0084; }


   /* -- level mark -- */

   ul.dropdown ul {
    width: 150px;
    padding: 3px 6px;
    border-style: solid;
    border-width: 1px;
    border-color: #f0f0f0 #666 #666 #f0f0f0;
    background-color: #fff;
    font-weight: normal;
    font-size: 11px;
   }

      ul.dropdown ul li {
      }



/*-------------------------------------------------/
 * @section      Support Class `dir`
 * @level sep   ul, .class
 */


ul.dropdown *.dir {
 padding-right: 25px;
 background-image: url(http://s61.radikal.ru/i171/1101/53/6bc77b78629c.png);
 background-position: 95% 50%;
 background-repeat: no-repeat;
}


/* -- Components override -- */

ul.dropdown-vertical ul {
 top: 0;
 left: 100%;
}

ul.dropdown-vertical-rtl ul {
 right: 100%;
}

ul.dropdown-horizontal,
ul.dropdown-linear,
ul.dropdown-upward {
 width: 100%;
}

ul.dropdown-horizontal ul *.dir {
 padding-right: 25px;
 background-image: url(http://i048.radikal.ru/1101/1d/8971aca83a3e.png);
 background-position: 100% 50%;
 background-repeat: no-repeat;
}

ul.dropdown-upward *.dir {
 background-image: url(images/nav-arrow-up.png);
}

ul.dropdown-vertical *.dir {
 background-image: url(http://i032.radikal.ru/1101/5d/e797f25032c0.png);
 background-position: 180px 50%;
}

ul.dropdown-vertical ul *.dir,
ul.dropdown-upward ul *.dir {
 background-image: url(images/nav-arrow-right.png);
 background-position: 100% 50%;
}

ul.dropdown-vertical-rtl *.dir {
 padding-right: 6px;
 padding-left: 25px;
 background-image: url(images/nav-arrow-left.png);
 background-position: 5px 50%;
}

ul.dropdown-vertical-rtl ul *.dir {
 padding-right: 0;
 background-image: url(images/nav-arrow-left.png);
 background-position: 0 50%;
}


@charset "UTF-8";

/**
 * Flickr Ultimate CSS Drop-Down Menu Theme
 *
 * @file      default.ultimate.css
 * @name      Flickr
 * @version      beta
 * @type      transitional
 * @browsers   Windows: IE5+, Opera7+, Firefox1+
 *            Mac OS: Safari2+, Firefox2+
 *
 *
 */

@import "default.css";


/*-------------------------------------------------/
 * @section      Base Style Extension
 */

ul.dropdown a,
ul.dropdown span {
 display: block;
 padding: 4px 6px;
}

ul.dropdown ul a,
ul.dropdown ul span {
 padding: 4px 0;
}


/*-------------------------------------------------/
 * @section      Base Style Override
 */

ul.dropdown li {
 padding: 0;
 border: none;
}


/*-------------------------------------------------/
 *   @section   Custom Styles
 */

ul.dropdown li a,
ul.dropdown *.dir {
 border-style: solid;
 border-width: 1px 1px 0;
 border-color: #fff;
}

ul.dropdown ul li a,
ul.dropdown ul *.dir {
 border: none;
}


ul.dropdown-vertical li a,
ul.dropdown-vertical *.dir {
 border-width: 1px 0 1px 1px;
}

ul.dropdown-vertical-rtl li a,
ul.dropdown-vertical-rtl *.dir {
 border-width: 1px 1px 1px 0;
}


/*-------------------------------------------------/
 * @section      Support Class `open` Usage
 * @source      js, artificial
 *
 */

ul.dropdown li.hover *.open {
 position: relative;
 z-index: 999;
 margin: -1px 0;
 padding-top: 5px;
 padding-bottom: 5px;
 border-color: #f0f0f0 #666 #666 #f0f0f0;
 background-color: #fff;
 background-image: url(http://i003.radikal.ru/1101/1f/22aa5ab93b2f.png);
 color: #0063dc;
 zoom: 1;
}

ul.dropdown-horizontal li.hover *.open,
ul.dropdown-upward li.hover *.open,
ul.dropdown-linear li.hover *.open {
 float: left;
 zoom: none;
}

ul.dropdown-vertical li.hover *.open {
 margin: 0 -1px;
 padding-top: 4px;
 padding-bottom: 4px;
 padding-left: 7px;
}

ul.dropdown-vertical-rtl li.hover *.open {
 padding-right: 7px;
}

ul.dropdown-vertical ul li.hover *.open {
 padding-right: 0;
 padding-left: 0;
}

ul.dropdown ul li.hover *.open {
 position: static;
 z-index: 0;
 float: none;
 margin: 0;
 padding-top: 4px;
 padding-bottom: 4px;
 border: none;
}

ul.dropdown ul li.hover *.open,
ul.dropdown-vertical li.hover *.open {
 background-image: url(http://i008.radikal.ru/1101/c1/1b426c0b911b.png);
}

ul.dropdown-vertical-rtl li.hover *.open,
ul.dropdown-vertical-rtl ul li.hover *.open {
 background-image: url(images/nav-arrow-left-open.png);
}

ul.dropdown-upward li.hover *.open {
 background-image: url(images/nav-arrow-up-open.png);
}

ul.dropdown-upward ul li.hover *.open {
 background-image: url(http://s16.radikal.ru/i191/1101/26/039ad4e8079f.png);
}

ul.dropdown a.dir:hover {
 background-image: url(http://s005.radikal.ru/i210/1101/bf/584f375b7736.png) !important;
}

ul.dropdown-upward a.dir:hover {
 background-image: url(images/nav-arrow-up-on.png) !important;
}

ul.dropdown ul a.dir:hover,
ul.dropdown-vertical a.dir:hover {
 background-image: url(http://s52.radikal.ru/i135/1101/43/29434fc42b48.png) !important;
}

ul.dropdown-vertical-rtl a.dir:hover,
ul.dropdown-vertical-rtl ul a.dir:hover {
 background-image: url(images/nav-arrow-left-on.png) !important;
}


   /* CSS2 clone */

   ul.dropdown li:hover > *.dir {
    position: relative;
    z-index: 999;
    margin: -1px 0;
    padding-top: 5px;
    padding-bottom: 5px;
    border-color: #f0f0f0 #666 #666 #f0f0f0;
    background-color: #fff;
    background-image: url(http://s012.radikal.ru/i319/1101/a7/0526edbcd226.png);
    color: #0063dc;
   }

   ul.dropdown-horizontal li:hover > *.dir,
   ul.dropdown-upward li:hover > *.dir,
   ul.dropdown-linear li:hover > *.dir {
    float: left;
   }

   ul.dropdown-vertical li:hover > *.dir {
    margin: 0 -1px;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 7px;
   }

   ul.dropdown-vertical-rtl li:hover > *.dir {
    padding-right: 7px;
   }

   ul.dropdown-vertical ul li:hover > *.dir {
    padding-right: 0;
    padding-left: 0;
   }

   ul.dropdown ul li:hover > *.dir {
    position: static;
    z-index: 0;
    float: none;
    margin: 0;
    padding-top: 4px;
    padding-bottom: 4px;
    border: none;
   }

   ul.dropdown ul li:hover > *.dir,
   ul.dropdown-vertical li:hover > *.dir {
    background-image: url(http://s005.radikal.ru/i211/1101/8c/f309a4f460c3.png);
   }

   ul.dropdown-vertical-rtl li:hover > *.dir,
   ul.dropdown-vertical-rtl ul li:hover > *.dir {
    background-image: url(images/nav-arrow-left-open.png);
   }

   ul.dropdown-upward li:hover > *.dir {
    background-image: url(images/nav-arrow-up-open.png);
   }

   ul.dropdown-upward ul li:hover > *.dir {
    background-image: url(http://s008.radikal.ru/i306/1101/35/8b34ad3f724d.png);
   }



    .leftmenu {
      margin: 0;
      padding: 0;
    }
    .leftmenu a {
    background:url('http://i079.radikal.ru/1010/8c/4438232c277d.gif') no-repeat scroll left 10px transparent;
    color:#555555;
    display:block;
    margin:0 0 1px;
    padding:5px 0 5px 19px;
    text-decoration:none;
    }
    a {
    background-color:inherit;
    color:#BA8023;}


    .leftmenu a:hover{
    text-decoration:none;
    background:url('http://i079.radikal.ru/1010/8c/4438232c277d.gif') no-repeat scroll left 10px #cfcfcf;
    margin:0 0 1px;
    padding:5px 0 5px 19px;
    color:#FFFFFF;
    }

avatar
kpripper
 

Мужчина

Сообщения : 437
Возраст : 40
Регистрация : 2009-08-06
Благодарности : 5

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

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

Страница 2 из 2 • Предыдущий  1, 2

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

Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Оформление вашего форума :: [Архив] Оформление форума

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