Я использую меню боковой панели Jquery Toggle, поэтому в меню есть стрелка вниз, чтобы нажимать меню вниз, чтобы показывать подменю каждый раз, когда вы нажимаете на него. Моя проблема заключается в том, что когда нет дочернего меню/подменю, стрелка вниз все еще отображается, и когда вы нажимаете на нее, она ест меню того же уровня ниже. Я использую меню в Silverstripe. Как сделать, чтобы стрелка отображалась только при наличии дочернего меню/подменю?
/------------------------------------------------------------- -Вот мое меню переключения js---------------------------------------------------------- -------/
$(document).ready(function() {
$('.second_level').hide();
$("div.menu > h3").css("background", "url(themes/tutorial/images/menuarrowdown.gif) no-repeat right");
$('div.menu > h3').click(function() {
$(this).next().slideToggle('fast', function() {
//set arrow depending on whether menu is shown or hidden
if ($(this).is(':hidden')) {
$(this).prev().css("background", "url(themes/tutorial/images/menuarrowdown.gif) no-repeat right");
} else {
$(this).prev().css("background", "url(themes/tutorial/images/menuarrowup.gif) no-repeat right");
}
return false;
});
});
});
/---------------------------------------------------Вот мой html-код----- --------------------------------------------------------/
<div id="productmenu"> <!-- productmenu starts -->
<div class="menu">
<h3><a href="#">Category 1</a></h3>
<ul class="second_level">
<li><a href="page.html">Option 1</a></li>
<li><a href="page.html">Option 2</a></li>
</ul>
</div> <!-- /menu -->
<div class="menu">
<h3><a href="#">Category 2</a></h3>
</div> <!-- /menu -->
<div class="menu">
<h3><a href="#">Category 3</a></h3>
<ul class="second_level">
<li><a href="page.html">Option 1</a></li>
<li><a href="page.html">Option 2</a></li>
<li><a href="page.html">Option 3</a></li>
</ul>
</div> <!-- /menu -->
</div><!-- /productmenu -->
/---------------------------------------------------Вот моя страница.ss---- ------------------------------------------/
<% control Menu(2) %>
<h3><a href="$Link" title="Go to the "{$Title}" page">$MenuTitle</a></h3>
<% if Children %> <ul class="second_level">
<% control Children %>
<li class="$LinkingMode"><a href="$Link" title="Go to the "{$Title}" page">$MenuTitle</a></li>
<% end_control %></ul>
<% end_if %>
<% end_control %>
Ваша помощь приветствуется. Пожалуйста, смотрите пример рис ниже.
Спасибо Сэм
Редактировать: чтобы устранить проблему с меню, просто переместите ‹% control Menu(2) %> выше и ‹% end_control %> ниже финишного элемента меню. Решение Js состоит в том, чтобы использовать новый Js Мэтта. Спасибо, Мэтт, Янк и Майло! Я ценю вашу помощь!
