Всем привет, я новичек в мире веб дизайна, поэтому судите строго, но справедливо
Собственно была задача написать меню, каждый элемент которого по щелчку раскрывается, по второму щелчку закрывается и при щелчке по другому пункту меню, ранее раскрытое меню закрывается, а новое открывается. уфф.
получился вот такой код
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<script>function Menu(id)
{
var menu2 = document.getElementById('menu_2').style;
var menu3 = document.getElementById('menu_1').style;
var menu = document.getElementById('menu_' + id).style;
if (menu.display == 'none')
{
menu3.display = 'none';
menu2.display = 'none';
menu.display = 'block';
}
else
{
menu.display = 'none';
}
}
</script>
</head>
<body>
<a href="#" class="rmenu" onclick="javascript:Menu('1')">
<li>Текст 1</li>
<ul id="menu_1" style="display:none;">
<a href="#" class="amenu"><li>Текст 1.1</li></a>
<a href="#" class="amenu"><li>Текст 1.2</li></a>
</ul>
</a>
<a href="#" onclick="javascript:Menu('2')">Текст 2
<ul id="menu_2" style="display: none;">
<li><a href="#">Текст 2.1</a></li>
<li><a href="#">Текст 2.2</a></li>
</ul>
</a>
</body>
</html>
Собственно все работает как часы, но есть подозрение что его можно упростить, т.к. при большем количестве пунктов меню он сильно разрастается(относительно, по две строчки на каждый пункт меню в javascripte). Подскажите как? Есть ли другие способы сделать подобное меню в javascript? И устройте разбор полетов по данному коду. Заранее всем огромное спасибо.