PDA

Просмотр полной версии : Ролловерное меню


pressdesign
05.03.2010, 03:01
Почитал форум, но так и не нашел как создать нормальное ролловерное меню.

У меня в шаблоне есть такой список. but_1.gif и так далее – кнопка с надписью:

<div class="menu-level1-no"><img src="images/nav/but_1.gif" width="210" height="27" /></div>
<div class="menu-level2-no"><img src="images/nav/but_1_2.gif" width="210" height="20" /></div>

Как создать ролловерное меню в настройках root, чтобы при наведении мышки появлялось другое изображение (более светлая кнопка с надписью). ОЧень мало документации, а в той что есть, я пробовал, не получается настроить gmenu.

И второй вопрос: возможно ли при наведении мышки на эту кномку-изображение, чтобы сразу под ней появлялся всплывающий список с несколькими другими кнопками? Это только можно решить с помощью java или все-таки средствами typoscript?

Заранее очень благодарен. Николай

gremoz
06.03.2010, 19:54
Изменение картинки при наведении, это к css и hover. На счет меню это только на javascript, typo3 не умеет работать с браузером клиента.

-=UncleByte=-
06.03.2010, 21:43
C помощью TS вполне можно сделать любую обвязку для элементов меню, в том числе и с использованием javascript. Правда в настоящее время такие выпадаюшие меню проще делать средствами html и css.
Как делать меню можно подсмотреть http://www.cssmenumaker.com/drop_down_css_menu.php или http://www.cssplay.co.uk/menus/

filippoff
06.03.2010, 23:55
Изменение картинки при наведении, это к css и hover. На счет меню это только на javascript, typo3 не умеет работать с браузером клиента.
ну, не обязательно. можно воспользоваться полем фалов в свойствах страницы и через тайпоскрипт вызывать любую картинку для любого действия.
вот здесь так сделано в верхнем меню, к примеру: http://mamalada.ru
выпадающее меню - да, проще на яве, тайпо выдает жутковатый код :)


lib.mainMenu = HMENU
lib.mainMenu.entryLevel = 0
lib.mainMenu {

1 = TMENU
1 {
NO {
allWrap = |
beforeImgTagParams = alt="{field:title}"
beforeImg.import = uploads/media/
beforeImg.import {
field = media
listNum = 0
}
RO = 1
beforeROImg.altText.field = abstract // description // title
beforeROImg = 1
beforeROImg.import = uploads/media/
beforeROImg.import {
field = media
listNum = 1
}
beforeImgLink = 1
doNotShowLink = 1
ATagTitle.field = abstract // description // title
allStdWrap.insertData = 1
}
#
ACT = 1
ACT {
allWrap = |
beforeImgTagParams = alt="{field:title}"
beforeImg.import = uploads/media/
beforeImg.import {
field = media
listNum = 1
}
beforeImgLink = 1
doNotShowLink = 1
ATagTitle.field = abstract // description // title
allStdWrap.insertData = 1
}
wrap = |
}
}