Hey everyone, I'm completely new to jQuery and could use some help. This accordion feature works perfectly on Firefox and Chrome, but I'm running into issues with IE7. You can see the problem in action at this link: here.
Specifically, if you click on 222 and then on 999, it collapses back to 222 on IE7.
However, on Firefox it remains open as expected.
I would really appreciate any assistance or suggestions on how to fix this issue.
Below is the JavaScript code that I am currently using:
$(function(){
$('.toc_content').find('li').each(function(){
var li=$(this);
if(li.find('> ul').length==1){
li.addClass('collapsed').find('> a').click(function(e){
var li=$(this).parent('li'), ul=li.find('> ul');
ul.toggle();
if(ul.is(':hidden')){
li.removeClass('collapsed').addClass('opened');
}
else{
li.removeClass('opened').addClass('collapsed')
}
});
}
});
});
var element = new Array();
$(function(){
lastName = window.location.pathname.split("/");
currentWindowLocation = lastName[lastName.length-1];
var fileLocation = $('a[href="'+currentWindowLocation+'"]');
$('a[href="'+currentWindowLocation+'"]').parents().map(function(){
element.push(this);
}
).get()
$('a[href="'+currentWindowLocation+'"]').attr('href','#');
var arrayLength = element.length;
for (var i = 0; i < arrayLength; i++) {
if(element[i].tagName == "UL" && element[i].className.match(/sub-menu/g) ){
element[i].setAttribute('style', 'display:block');
}
if(element[i].className.match(/has-children/g)){
element[i].className = "has-children opened";
}
}
});
Another issue that arises across all browsers – though it's more of a functionality question than a bug – is when clicking on a parent menu to reveal a sub-menu and then being redirected to the relevant page.
What I want to achieve is - Upon initial click, the sub-menu should not open. Instead, upon redirection to the new page, the sub-menu opens up.