I'm trying to implement accordion menu for quick launch ( as in http://borderingdotnet.blogspot.com/2013/04/accordion-left-navigation-for.html ), but it behaves very weird. Sometimes it works correctly, but sometimes after closing the browser and starting it again it does not. I can open the console and debug it (IE) and it seems to work fine... except that there are no results on the page, nothing changes. I've tried replicating this in FF, and the problem initially started in a similar way, but after debugging it somehow started to work... and now it is working, even after refreshing page or restarting browser. The weirdest thing is that when I add alert with whatever in the beginning of the script, it's always working, as if alert would somehow force the quick launch to apply changes.
Any ideas? This is a modified standard master page, put into module and on-premise package.
EDIT: Relevant script
<script type="text/javascript">
$(function () {
/*set dynamic css logic*/
var em = document.location.pathname.split('/')[1]
if ( em != 'EmployeeManual') {
return false;
}
var table = document.getElementById('scriptWPQ2');
if (table != null) {
table.setAttribute('style', 'position: absolute; top: 210px; left: 410px; margin: -100px 0 0 -200px;');
}
var a = $('#sideNavBox .menu-item.selected');
//alert(document.location.pathname.split('/')[1]);
if (a.length) {
//propagates the selected class, up the three.
$('li.static').removeClass('selected');
$('#sideNavBox .menu-item.selected').parents('li.static').addClass('selected');
//collapses top siblings of selected branch
$('#sideNavBox .menu-item.selected').parents('li.static').last().siblings()
.find('> ul').hide();
}
else {
$('#sideNavBox .root.static > li.static > ul').hide();
}
var b = $('#sideNavBox .root.static > li.static');
//alert(b);
/*set accordion effect*/
b.each(function () {
if ($(this).find('ul').length) {
$(this).addClass('father').click(function () {
//if ($(this).children('ul').css('display') != 'none') {
// $(this).removeClass('selected').children('ul').slideUp();
//}
//else {
/*collapse-siblings*/
$(this).siblings().removeClass('selected').children('ul').slideUp();
/*expand*/
$(this).addClass('selected').children('ul').slideDown();
//}
/*added: stop event propagation to link nodes*/
$('a.static').click(function (event) {
event.stopPropagation();
});
/*added*/
return false;
});
}
});
});
</script>
I have also tried to wrap the code in ExecuteOrDelayUntilScriptLoaded but the result was the same.