Двухуровневое меню в 1 div'e

[korwru]

Подскажите пожалуйста как можно реализовать подобную структуру меню, а именно, чтобы 2 уровень меню был вложен в div первого...

<div id="b1">
 <div class="b">
  <ul>
   <li class="l1"><a href="link" class="level1">LINK TEXT 1</a>
    <ul>
     <li class="level2"><a href="link">text</a></li>
     <li class="level2"><a href="link">text</a></li>
     <li class="level2"><a href="link">text</a></li>
    </ul>
   </li>
  </ul>
 </div>
</div>
<div id="b2">
 <div class="b">
  <ul>
   <li class="l1"><a href="link" class="level1">LINK TEXT 1</a>
    <ul>
     <li class="level2"><a href="link">text</a></li>
     <li class="level2"><a href="link">text</a></li>
     <li class="level2"><a href="link">text</a></li>
    </ul>
   </li>
  </ul>
 </div>
</div>

Мой код, но вложенность неправильная. А именно второй уровень идёт после закрытия первого.

# Menu 1 cObject
lib.menu_1 = HMENU
# First level menu-object, textual
lib.menu_1.1 = TMENU
lib.menu_1.1 {
  expAll=1
  noBlur = 1
  wrap= |
  # Normal state properties
  NO {
    stdWrap.cObject = COA
    stdWrap.cObject {
            10 = LOAD_REGISTER
            10{
                Counter1.cObject = TEXT
                Counter1.cObject.data = register:Counter1
                Counter1.cObject.wrap = |+1
                Counter1.prioriCalc = intval
            }
            20 = TEXT
      20.field = title // subtitle
        }
        linkWrap = |
               
    ATagTitle.field = title // subtitle
  ATagParams = class="level1"
  stdWrap.htmlSpecialChars = 1
  allStdWrap.dataWrap = <div id="b{register:Counter1}"><div class="b"><ul><li class="l1"> | </li></ul></div></div>

  }
}
# Second level menu-object, textual
lib.menu_1.2 = TMENU
lib.menu_1.2 {
  noBlur = 1
# Normal state properties
wrap = <ul> | </ul>
NO.allWrap = <li class="level2"> | </li>
NO.stdWrap.htmlSpecialChars = 1
}

[Peter]

Такая же проблема была. Получилось вот таким способом. Может и коряво, зато работает.

lib.leftsidemenu = HMENU
lib.leftsidemenu {
special = list
special.value = 7,8,9,19,20
wrap = <div id="servicemenu"> | </div>
1 = TMENU
1 {
noBlur = 1
expAll = 1
ACT = 1
CUR = 1
NO {
linkWrap = |<ul style="display:none;">
wrapItemAndSub = <div class="block">|</div>
ATagTitle.field = title
stdWrap.htmlSpecialChars = 1
}
ACT {
linkWrap = |<ul style="display:block;">
wrapItemAndSub = <div class="act">|</div>
ATagTitle.field = title
stdWrap.htmlSpecialChars = 1
doNotLinkIt = 1
}
CUR {
linkWrap = |<ul style="display:block;">
wrapItemAndSub = <div class="act">|</div>
ATagTitle.field = title
stdWrap.htmlSpecialChars = 1
doNotLinkIt = 1
}
}
2 = TMENU
2 {
noBlur = 1
expAll = 1
wrap = | </ul>
NO {
linkWrap = <li>|</li>
stdWrap.htmlSpecialChars = 1
ATagTitle.field = title
}
}
}

ХТМЛ такой...

<div id="servicemenu">
<div class="block">
<a href="index.php?id=8" title="Видеонаблюдение">Видеонаблюдение</a>
<ul style="display:none;">
<li><a href="index.php?id=13" title="Уличное">Уличное (периметр)</a></li>
<li><a href="index.php?id=14" title="Внутреннее">Внутреннее (комнаты)</a></li>
</ul>
</div>
<div class="act">Освещение
<ul style="display:block;">
<li><a href="index.php?id=16" title="Уличное">Уличное</a></li>
<li><a href="index.php?id=17" title="Внутреннее">Внутреннее</a></li>
</ul>
</div>
<div class="block">
<a href="index.php?id=19" title="Сетевая связь">Сетевая связь</a>
<ul style="display:none;">
<li><a href="index.php?id=21" title="Беспроводная">Беспроводная</a></li>
<li><a href="index.php?id=22" title="Проводная">Проводная</a></li>
</ul>
</div>
</div>

[dmartynenko]

А зачем вам display:none ?

В менюшках есть параметр, который позволяет показывать подменю только для текущего выбранного пункта верхнего уровня.

Т.е. если пользователь находится на p2 или p2.x то меню выглядит так:
p1
p2
p2.1
p2.2
p3

Если на p3 или p3.x
p1
p2
p3
p3.1
p3.2

[-=UncleByte=-]

Полностью согласен с предыдущим постом, убрать ExpAll и не надо будет добавлять display:none.

[Peter]

Ыыыыыы! Забыл написать, jquery + у меня вооот такой код ещё присутствует:

$(function(){
$('#servicemenu .block').hover(function() {
if(this.className != 'block active') {
$('#servicemenu .block').removeClass('active');
$(this).addClass('active');
$('#servicemenu .block UL').hide(500);
$(this).find('UL').show(500);
}
else {
return false;
}
});
});

Симпатишная менюшка получилась...

[-=UncleByte=-]

Тогда понятно почему и как