Я работаю над меню JQuery, которое необходимо развернуть и свернуть. Тем не менее, у меня возникают некоторые проблемы, связанные с тем, что подменю выстраиваются в линию, как хотелось бы. В принципе, я хочу, чтобы элементы подменю были в очереди с элементами верхнего меню. Однако, поскольку он стоит сейчас, весь элемент подменю имеет отступ. Мой код выглядит следующим образом:Свертывание меню с помощью JQuery
HTML
<ul id="theMenu">
<li><a title="open or close this section" href="#">Info</a>
<ul>
<li><a href="#">Basic</a></li>
<li><a href="#">Advanced</a></li>
</ul>
</li>
<li><a title="open or close this section" href="#">Documents</a>
<ul>
<li><a href="#">Newsletters</a></li>
<li><a href="#">Policies and Procedures</a></li>
<li><a href="#">job Descriptions</a></li>
</ul>
</li>
</ul>
JavaScript
$(document).ready(function() {
$("#theMenu > li > a").not(":first").find("+ ul").slideUp(1);
$("#theMenu > li > a").click(function() {
$(this).find("+ ul").slideToggle("fast");
});
});
CSS
#theMenu, #theMenu ul { list-style:none; width:15em; }
#theMenu a { background:#F6F6F6; color:#010101;
display:block; font-weight:bold; padding:0.5em 1em; text-decoration:none;
border:1px solid #DFDFDF;
}
#theMenu ul a { background:#F6F6F6; color:#010101;
font-weight:normal; text-decoration:none;
}
#theMenu ul a:hover { background:#F0EBE1; text-decoration:underline; color:#711515; }
Как сделать подменю скрытым с левым краем корневого меню?
Спасибо!
ДОБАВЛЕНО: Demo here
Я не смог повторить вашу проблему: http://jsfiddle.net/brianflanagan/sH2WJ/ Какой браузер вы используете? –