ElcomCMS: Place arrow on panalbar menu item with sub items

The default ElcomCMS panalbar menu does not have functionality to place an indicator on menu items that have sub items. This is very important for usability.

You can implement this by inserting the following code in your PostCustomJavaScript.js file.


// Place arrows on each panalbar menu item that has sub-items
$(document).ready(function() {
    $('.slide').each(function(){
        if($(this).css('display') == "none"){
            $(this).prev().children('span').addClass('menuArrowRight');      
        }else{
            $(this).prev().children('span').addClass('menuArrowDown');
        }
    })  
})

You will also need to add something like the following to your site CSS file.
Obviously this will depend on how your menu is styled and where the indicator images are located :

.menuArrowRight{
    background: url("/images/UserUploadedImages/arrow_blue_side.gif") no-repeat scroll 160px center;
}
.menuArrowDown{
    background: url("/images/UserUploadedImages/arrow_blue_down.gif") no-repeat scroll 160px center;
}