У меня следующая проблема. Сделал меню как писали в начале этой темы. Вот тот код:
|
Код:
|
<script>
// Обворачиваем функцию toggle в локальное замыкание:
var toggle = function() {
// Ссылка на текущий открытый div:
var currentDiv = null;
// Функция для "раскрытия" элемента:
function open(divElement) {
// Тут можно добавить эффект "плавного" открытия:
divElement.style.display = "block";
currentDiv = divElement;
}
// Функция для "закрытия" элемента:
function close(divElement) {
// Тут можно добавить эффект "плавного" закрытия:
divElement.style.display = "none";
currentDiv = null;
}
// Возвращаем функцию, которая будет вызываться по toggle()
return function(divID) {
// Получаем элемент из DOM
var divElement = document.getElementById(divID);
// Если такой есть:
if (divElement) {
// Если уже открыт какой-то div - закрываем.
if(currentDiv != null) close(currentDiv);
// Открываем вызваный.
open(divElement);
}
}
// Вызываем нашу "обертку", теперь toggle() вызывает функцию, описанную по "return"
}();
</script>
<style>
.myDiv {
display: none;
}
</style> |
Все работает прекрасно, но у меня возникла вот какая проблема....
Содержимое дива .myDiv генерируется скриптом:
|
Код:
|
if ($CURRENT_DEPTH==1) { //это главная категория меню
?>
<li><a href="javascript://" onClick="toggle('<?=$arSection["ID"]?>')"><?=$arSection["NAME"]?></a></li>
<?
$ss = $arSection["ID"];
} ?>
<?
if ($CURRENT_DEPTH > 1): //это подкатегории
?><div class="myDiv" id=<?=$ss?>>
<li><a href="<?=$arSection["SECTION_PAGE_URL"]?>"><?=$arSection["NAME"]?></a></li>
<? endif?> |
Смысл в том, что при нажатии на категорию появляется только один элемент дива myDiv, а остальные скрыты. Я так понял что нужно как то модифицировать вот этот кусок скрипта:
|
Код:
|
<style>
.myDiv {
display: none;
}
</style> |
но в яве я полный ноль и слезно прошу мне помочь....
Вот исходный код страницы после обработки скрипта:
|
Код:
|
<div class="catalog-section-list">
<ul>
<li><a href="javascript://" onClick="toggle('90')">Модульные системы на основе круглой трубы</a></li>
<ul><div class="myDiv" id=90>
<li><a href="/index.php?SECTION_ID=99">FLOW </a></li>
</div>
<div class="myDiv" id=90>
<li><a href="/index.php?SECTION_ID=93">Joker </a></li>
</div>
<div class="myDiv" id=90>
<li><a href="/index.php?SECTION_ID=100">Loop </a></li>
</ul> <li><a href="javascript://" onClick="toggle('91')">Модульные системы на основе перфорированных стоек</a></li>
<ul><div class="myDiv" id=91>
<li><a href="/index.php?SECTION_ID=104">раз</a></li>
</div>
</ul> <li><a href="javascript://" onClick="toggle('92')">Сетки и аксессуары</a></li>
<ul><div class="myDiv" id=92>
<li><a href="/index.php?SECTION_ID=103">два</a></li>
</div>
</ul> |