All I needed was an accordion menu, sorted!
Only have one collapsable block open at one time
-
03-06-2022 - |
题
I have a jquery exapandable list, currently when i click a link it opens IN ADDITION to any open previously. How can I change this so if I had mobile open then i click Landline, it opens landline but also closes mobile? I only want one item to be open at any one time.
JS
$(document).ready(function() {
setTimeout(function() {
// Slide
$('#menu1 > li > a.collapsed + ul').slideToggle('medium');
$('#menu1 > li > a').click(function() {
$(this).toggleClass('expanded').toggleClass('collapsed').parent().find('> ul').slideToggle('medium');
});
$('#example1 .expand_all').click(function() {
$('#menu1 > li > a.collapsed').addClass('expanded').removeClass('collapsed').parent().find('> ul').slideDown('medium');
});
$('#example1 .collapse_all').click(function() {
$('#menu1 > li > a.expanded').addClass('collapsed').removeClass('expanded').parent().find('> ul').slideUp('medium');
});
}, 250);
});
HTML
<div id="example1">
<ul id="menu1" class="example_menu">
<li><a class="collapsed">Mobile</a>
<ul>
<li><h2>TEST1</h2><br>
</ul>
</li>
<li class="footer"><span> </span></li>
<li><a class="collapsed">Landline</a>
<ul>
<li><h2>TEST2</h2><br>
</ul>
</li>
jsfiddle http://jsfiddle.net/EfURx/1/
解决方案 3
其他提示
I have made something for you :) I hope that will helps you. AUTO CLOSE COLLAPSIBLE
$('.openMe').each(function() {
var coll = $(this);
coll.trigger('expand');
});
$('.openMe').each(function() {
var coll = $(this);
coll.trigger('collapse');
});
Good work
solved by using the 'Accordion' option on these range of menus file:///Users/johnfarrell/Desktop/collapsible-menu/collapsible-menu.html
不隶属于 StackOverflow