Tying in .addClass() with other functions?
Posted
by
Anders H
on Stack Overflow
See other posts from Stack Overflow
or by Anders H
Published on 2010-08-20T18:09:23Z
Indexed on
2010/12/24
16:54 UTC
Read the original article
Hit count: 225
jQuery
|jquery-selectors
Assuming an accordion dropdown with the standard form of:
<ul>
<li>
<a href="#">Main Element</a>
<ul>
<li>
<a href="#">Dropdown Element</a>
</li>
</ul>
</li>
</ul>
I'm using jQuery to expand when the parent element link is clicked:
var $j = jQuery.noConflict();
function initMenus() {
$j('ul.menu ul').hide();
$j.each($j('ul.menu'), function(){
$j('#' + this.id + '.expandfirst ul:first').show();
});
$j('ul.menu li a').click(
function() {
var checkElement = $j(this).next();
var parent = this.parentNode.parentNode.id;
if($j('#' + parent).hasClass('noaccordion')) {
$j(this).next().slideToggle('normal');
return false;
}
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
if($j('#' + parent).hasClass('collapsible')) {
$j('#' + parent + ' ul:visible').slideUp('normal');
}
return false;
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
$j('#' + parent + ' ul:visible').slideUp('normal');
checkElement.slideDown('normal');
return false;
}
}
);
}
$j(document).ready(function() {initMenus();});
To add a class to the Main Element when clicked (aka the class is enabled anytime the dropdown is expanded) I'm trying to use .toggleClass(className) without luck, most likely to my positioning. Where can I add this element to get the desired effect?
© Stack Overflow or respective owner