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

sanyafm

  • Новичок
  • 6
  • 0 / 0
Доброго времени суток. Обшарил форум но так и не нашел ответа.

Проблема следующая. У меня в главном меню Joomla 1.5 выдающие под пункты. Они вылезают при наведении курсора.
Мне нужно чтобы они выпадали при клике мышью! Обшарив воистину дебильный CSS шаблона нашёл строки отвечающие за этот эффект но так и не смог определить что там конкретно отвечает за него.

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

Код: css
#horiznav li:hover ul, #horiznav li li:hover ul, #horiznav li li li:hover ul, #horiznav li li li li:hover ul, #horiznav li.sfHover ul, #horiznav li li.sfHover ul, #horiznav li li li.sfHover ul, #horiznav li li li li.sfHover ul{z-index:100; left:auto}

Прошу помочь с проблемой, а то никак не победить её))


прикрепляю CSS стиль
Код: css
<?php header("Content-type: text/css"); ?>
#top_menu{margin:0 5px; display:block; position:relative; z-index:10000; border-bottom:1px solid #e4e4e4}
#horiznav{height:37px; z-index:500; float:none}
#horiznav ul{list-style:none; line-height:37px; padding-top:0px}
#horiznav ul li{position:relative; margin:0}
#horiznav a{text-transform:capitalize; display:block; cursor:pointer; height:37px; padding:0px 0px 0px 25px; margin:0px 0px 0px 0px; font:bold 11px/37px Tahoma}
#horiznav li a:hover{height:37px}
#horiznav li{float:left; padding:0; padding:0px 25px 0px 0px}
#horiznav ul ul a{background:none}
#horiznav ul ul{border:none}
#horiznav li li a{font-weight:normal; padding:0 0px 0 0px; margin:0; height:32px; line-height:32px; text-indent:0px}
#horiznav li ul a span{margin:0 0 0 5px; display:block}
#horiznav ul ul a{display:block; text-decoration:none; text-transform:capitalize; height:auto; font-weight:bold}
#horiznav li li{padding:0; background:none}
#horiznav li li{float:left; padding:0}
#horiznav li:hover, #horiznav li.sfHover{left:0}
#horiznav ul ul a:hover{background:none; height:auto; line-height:32px; padding:0 0px 0 0px; margin:0}
#horiznav li ul{position:absolute; left:-999em; height:auto; font-weight:normal; border-width:0; margin:0px 0 0 0px; padding:0; border-bottom:none}
#horiznav li:hover, #horiznav li.sfHover{position:static}
#horiznav li:hover ul ul, #horiznav li:hover ul ul ul, #horiznav li:hover ul ul ul ul,  #horiznav li.sfHover ul ul, #horiznav li.sfHover ul ul ul, #horiznav li.sfHover ul ul ul ul{left:-999em}
#horiznav li:hover ul, #horiznav li li:hover ul, #horiznav li li li:hover ul, #horiznav li li li li:hover ul, #horiznav li.sfHover ul, #horiznav li li.sfHover ul, #horiznav li li li.sfHover ul, #horiznav li li li li.sfHover ul{z-index:100; left:auto}
#horiznav ul ul li a{border-right:none}
#horiznav ul li:hover li:hover, #horiznav ul li#current ul li a, #horiznav ul li#current ul li, #horiznav ul li#current ul li a:hover, #horiznav ul li#current ul li.hover, #horiznav li.haschild:hover li span, #horiznav li.haschild.sfHover li span, #horiznav li.sfHover li span, #horiznav ul li li a, #horiznav ul li.haschild li#current a, #horiznav ul li.haschild li#current, #horiznav ul li.sfHover li.sfHover, #horiznav ul li ul li a:hover, #horiznav ul li ul li:hover, #horiznav ul li ul li.sfHover{background-image:none}
#horiznav li ul ul{margin:-32px 0 0 173px}
#horiznav ul li:hover li a, #horiznav ul li.sfHover li a{background-image:none}
#horiznav ul ul a, #horiznav li ul{width:173px}
#horiznav li li, #horiznav li.haschild ul li#current:hover, #horiznav li.haschild ul li#current.sfHover{width:173px}

#top_menu_d{margin:0 5px; display:block; position:relative; z-index:10000; border-bottom:1px solid #e4e4e4}
#horiznav_d{height:37px; position:relative; display:block; position:relative; padding:0px; margin:0px; overflow:hidden; background-color:#dbdbdb}
#horiznav_d a{white-space:nowrap; display:block; float:left; text-transform:capitalize; cursor:pointer; height:37px; padding:0px 25px 0px 25px; margin:0px 0px 0px 0px; font:bold 11px/38px Tahoma}
#horiznav_d ul{margin:0; padding-top:0px; line-height:37px; float:left}
#horiznav_d ul ul ul{left:-20000px}
#horiznav_d li{padding:0; margin:0 0px 0 0; float:left; display:block}
#horiznav_d li ul{display:none; margin:0 auto; padding:0; position:absolute; top:37px; height:37px; overflow:hidden; left:0; width:100%}
#horiznav_d li a span, #horiznav_d li .separator span{display:block; padding:0}
#horiznav_d li ul a, #horiznav_d li.active ul a{display:block; float:left; font-weight:normal; padding:0 10px; background:none; height:37px; line-height:37px}
#horiznav_d li.active ul{display:block}
#horiznav_d li:hover ul, #horiznav_d li.sfHover ul{display:block; z-index:6000}
#horiznav_d li a, #horiznav_d li .separator{font:bold 11px/37px Tahoma; text-transform:capitalize}
#horiznav_d li li{background:none}

#horiznav_d li li.active, #horiznav_d li li.active:hover,
#horiznav_d li li.active.sfHover,
#horiznav_d li li:hover, #horiznav_d li li.sfHover{background:none}
#horiznav_d li li.active a, #horiznav_d li li.active .separator,
#horiznav_d li li.active a:hover, #horiznav_d li li.active .separator:hover,
#horiznav_d li li:hover a, #horiznav_d li li:hover .separator,
#horiznav_d li li.sfHover a, #horiznav_d li li.sfHover .separator{background:none}
#horiznav_d li li a, #horiznav_d li li .separator{background:none}
#horiznav_d li li, #horiznav_d li li a span, #horiznav_d li li .separator span{background:none}
#horiznav_d li li a span, #horiznav_d li li .separator span{}
#horiznav_d li.sfHover li a, #horiznav_d li:hover li a,
#horiznav_d ul li.active ul li.active li a,
#horiznav_d ul li.active.parent ul li a,
#horiznav_d li.sfHover li .separator,
#horiznav_d li:hover li .separator,
#horiznav_d ul li.active.parent ul li .separator,
#horiznav_d ul li.active.parent ul li .seperator{text-indent:0px; background:none}
#horiznav_d li.active li a, #horiznav_d li.active.parent li a,
#horiznav_d li.active li .separator,
#horiznav_d li.active.parent li .separator{background:none}
#horiznav_d ul ul li:hover, #horiznav_d ul ul li.sfHover{background-image:none}
#horiznav_d ul ul li a, #horiznav_d ul li.active.parent ul a,
#horiznav_d ul li.active.parent ul a span, #horiznav_d ul ul li .separator,
#horiznav_d ul li.active.parent ul .separator,
#horiznav_d ul li.active.parent ul .separator span{background:none}
#horiznav_d ul ul li.active,
#horiznav_d ul ul li.active:hover,
#horiznav_d ul ul li.active.sfHover{background:none}
#horiznav_d li.parent li a:hover{background:none}
#horiznav_d ul li ul{width:100%}

#mainlevel ul,
.menu ul{list-style:none; margin:0; padding:0}
#mainlevel{padding:0; text-align:left; margin-left:-19px; margin-right:-8px}
.menu{padding:0; text-align:left; margin-left:-19px; margin-right:-8px}
#mainlevel li,
.menu li,
.menu li:hover{background-image:none}
#mainlevel li a,
.menu li a{height:26px; line-height:20px; text-decoration:none; display:block; font-size:12px; text-decoration:none; text-indent:22px; padding-top:5px}

a.mainlevel{display:block; width:100%; font-size:12px; height:26px; line-height:20px; padding-top:5px; text-decoration:none; text-indent:24px}
a.sublevel{display:block; padding:2px 4px 0px 15px; text-decoration:none}
a.sublevel:hover,
a.sublevel:active,
a.sublevel:focus{text-decoration:underline}
.module a.sublevel{display:block; padding:0px 4px 12px 15px; margin:0}

« Последнее редактирование: 26.06.2010, 14:00:30 от sanyafm »
*

Bogdan808

  • Захожу иногда
  • 89
  • 2 / 1
Re: Выпадающее меню при клике мышью
« Ответ #1 : 26.06.2010, 13:58:44 »
для анимации используем jQuery или Motools библиотеку!
*

Bogdan808

  • Захожу иногда
  • 89
  • 2 / 1
Re: Выпадающее меню при клике мышью
« Ответ #2 : 26.06.2010, 14:00:42 »
http://ruseller.com/lessons.php?rub=32&id=274
тут более подробно
*

sanyafm

  • Новичок
  • 6
  • 0 / 0
Re: Выпадающее меню при клике мышью
« Ответ #3 : 26.06.2010, 14:53:00 »
Спасибо попробую.

Только вопрос задам немного корректней.
Какие значения нужно изменить чтобы мне достичь эффекта выпадения, при нажатии на родителя (именно при клике должен открываться), стандартными способами. То есть отредактировать имеющийся CSS или может системный ява ( хотя как показало мне меню то что ни к одному из ява оно не привязано)
*

Bogdan808

  • Захожу иногда
  • 89
  • 2 / 1
Re: Выпадающее меню при клике мышью
« Ответ #4 : 26.06.2010, 15:11:56 »
Например:
У вас есть меню.
Вы силами jQuery делаете его невидимым (как это делать ищите в статьях по jQuery).
И теме же силами jQuery создаете эфект анимации..
чтобы при клике ваше меню плавненько сползало в низ, ну или еще куда-нибудь
*

Bogdan808

  • Захожу иногда
  • 89
  • 2 / 1
Re: Выпадающее меню при клике мышью
« Ответ #5 : 26.06.2010, 15:14:25 »
А вообще скачайте вот этот видео курс по jQuery. Там подробно описывается это дело
http://vse-uroki.ru/programs/programming/5341-kurs-po-jquery-xomich-d-2010-rus.html
*

sanyafm

  • Новичок
  • 6
  • 0 / 0
Re: Выпадающее меню при клике мышью
« Ответ #6 : 26.06.2010, 15:58:42 »
Как провернуть через jQuery понятно. Спасибо, уроки все же скачал))

Но интересует как бы это сделать так, чтобы огороды не городить.

Ведь оно выпадает при наведении мыши!
В идеале выставить бы другие значения, чтобы реагировало на клик а не наведение.
*

Bogdan808

  • Захожу иногда
  • 89
  • 2 / 1
Re: Выпадающее меню при клике мышью
« Ответ #7 : 26.06.2010, 17:12:51 »
смотрите видео уроки там упоминается о соответствующих событиях
событие cliclk вам нужно... в общем вникайте
*

ЖиВоЙ

  • Захожу иногда
  • 362
  • 3 / 0
Re: Выпадающее меню при клике мышью
« Ответ #8 : 12.07.2010, 23:03:52 »
посоветуйте модули с выпадающем меню при клике. только обычный аккордеон не советовать - уже два раза пробовал и всё без толку.
« Последнее редактирование: 13.07.2010, 22:21:08 от ЖиВоЙ »
"Если хочешь сказать мне слово, попытайся использовать рот". (БГ)
*

ЖиВоЙ

  • Захожу иногда
  • 362
  • 3 / 0
Re: Выпадающее меню при клике мышью
« Ответ #9 : 13.07.2010, 22:20:22 »
ауу!
"Если хочешь сказать мне слово, попытайся использовать рот". (БГ)
*

VetaJI

  • Осваиваюсь на форуме
  • 28
  • 0 / 0
Re: Выпадающее меню при клике мышью
« Ответ #10 : 02.11.2010, 12:25:31 »
Самый простой способ это создать меню хардкодом и под каждый пункт подложить отдельное меню, которое необходимо будет средствами Jquery скрыть и прописать эффект при клике на пункт !
« Последнее редактирование: 06.11.2010, 09:59:58 от VetaJI »
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Большое меню Joomla

Автор Amakeeva

Ответов: 1
Просмотров: 244
Последний ответ 22.01.2018, 13:17:45
от effrit
Как можно отображать имя пользователя в название меню?

Автор selimoff

Ответов: 27
Просмотров: 3238
Последний ответ 02.01.2018, 15:24:44
от logan-19
как сделать пункт меню не кликабельным?

Автор qweqweqwe

Ответов: 13
Просмотров: 6037
Последний ответ 07.09.2017, 01:45:49
от forzi
Сдвинуть пункты меню в левое положение

Автор wectra

Ответов: 6
Просмотров: 563
Последний ответ 12.07.2017, 21:09:01
от wectra
Не отображаются пункты в меню

Автор physic

Ответов: 16
Просмотров: 16054
Последний ответ 27.05.2017, 00:10:15
от OutLaw1