Permalink
Browse files

Adding support for multiple collapsible menus per page

  • Loading branch information...
1 parent ef25781 commit daacf96b9b4426563fb8cb9f25076e678c52cf28 @tommcfarlin committed Apr 10, 2012
View
@@ -24,7 +24,7 @@
</p>
</div><!-- /about -->
- <div id="demo">
+ <div class="demo">
<ul id="menu">
<li>
Leaf
@@ -75,7 +75,43 @@
</li>
</ul>
<div id="status"></div>
- </div><!-- /demo -->
+ </div><!-- /.demo -->
+
+ <div class="demo">
+ <ul id="accordion">
+ <li>Parent #1</li>
+ <li>
+ <ul>
+ <li>Lorem ipsum</li>
+ </ul>
+ </li>
+ <li>Parent #2</li>
+ <li>
+ <ul>
+ <li>Lorem ipsum</li>
+ </ul>
+ </li>
+ <li>Parent #3</li>
+ <li>
+ <ul>
+ <li>Lorem ipsum</li>
+ </ul>
+ </li>
+ <li>Parent #4</li>
+ <li>
+ <ul>
+ <li>Lorem ipsum</li>
+ </ul>
+ </li>
+ <li>Parent #5</li>
+ <li>
+ <ul>
+ <li>Lorem ipsum</li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /.demo -->
+
</div><!-- /container -->
</body>

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.
View
@@ -1,8 +1,13 @@
$(function() {
$('#menu').collapsible({
- effect: 'slide',
+ effect: 'none',
initialCollapse: true
});
-
+
+ $('#accordion').collapsible({
+ effect: 'slide',
+ initialCollapse: true
+ });
+
});
View
@@ -76,6 +76,10 @@ When a nested menu has been expanded, the parent `ul` will have the class `expan
## Changelog
-_1.0 (2012.04.07)_
+_0.2 (2012.04.09)_
+
+* Adding support for multiple collapsible menus per page
+
+_0.1 (2012.04.07)_
* Initial Release
@@ -14,7 +14,7 @@
var opts = $.extend({}, $.fn.collapsible.defaults, options);
return this.each(function(evt) {
- setupMenus(opts);
+ setupMenus($(this).attr('id'), opts);
});
}; // end collapse
@@ -29,9 +29,9 @@
*
* opts The plugins array of options
*/
- function setupMenus(opts) {
+ function setupMenus(sId, opts) {
- $('ul').parent('li')
+ $('#' + sId + ' li ul').parent('li')
.prev()
.each(function() {
@@ -57,8 +57,7 @@
* $menu The menu to toggle
*/
function toggle(opts, $menu) {
-
- $menu = $(this).next();
+
switch(opts.effect.toString().toLowerCase()) {
case 'fade':
@@ -85,7 +84,7 @@
* $menu The menu to toggle
*/
function collapse(opts, $menu) {
-
+
// Updates the class name of the menu based on its state
$menu.toggleClass(function() {

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.

0 comments on commit daacf96

Please sign in to comment.