/ Published in: JavaScript
Very basic accordion effect
Common structure would be an ID'd UL, and each LI to have a first child with the class of head
Shows and hides siblings of .head, attaches ID of expanded to current element
Common structure would be an ID'd UL, and each LI to have a first child with the class of head
Shows and hides siblings of .head, attaches ID of expanded to current element
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
$.fn.expander = function() { $('.head', this).css("cursor","pointer"); $('.head', this).siblings().hide(); var expandedid = 'expanded'; $('.head', this).bind('click', function() { $('#' + expandedid + ' .head').siblings().hide('slow'); var currentid = $(this).parent().attr('id'); $('#' + expandedid).attr({id: ''}); if(currentid !== expandedid) { $(this).siblings().show('slow'); $(this).parent().attr({id: expandedid}); } return false; }) }