$(document).ready(function() {
$("#s4-leftpanel-content ul.root>li.static").css("border-bottom","1px Solid #eaeaea");
$("div.s4-ql div.menu-vertical > ul.root > li.static >a").each(function()
{
// Does this have children UL elements
if($(this).parent().children("ul").size() > 0){
//initial load hide
$(">ul", $(this).parent()).hide();
$($(this).parent()).addClass("cssClosed");
$("div.menu-vertical>ul.root>li.static>ul.static>li.selected").parent().css("display", "block");
$("div.menu-vertical>ul.root>li.static>ul.static>li.selected").parent().parent().addClass("cssOpen");
//add toggle
$(this).toggle(function() {
$(">ul", $(this).parent()).show("slow");
$($(this).parent()).removeClass("cssClosed");
$($(this).parent()).addClass("cssOpen");
},
function() {
$(">ul", $(this).parent()).hide("slow");
$($(this).parent()).removeClass("cssOpen");
$($(this).parent()).addClass("cssClosed");
}
);
}
});
});
The css:
.cssClosed {
background:url('/_layouts/images/Menu-right.gif') no-repeat 160px 7px;
}
.cssOpen{
background:url('/_layouts/images/Menu2.gif') no-repeat 150px 7px;
}
The result (closed):
The result (opened):
8 comments:
This is exactly what I was looking for. Thank you very much. I have one problem in this, images are not showing in the quick launch. Could you please help me on this? Thanks
I figured it out. They were hidden behind something, so I just had to set the positions right. Thanks again for the article.
nice solution, thanks!
The following css will show the buttons (they were hidden for me as well):
.cssClosed {
background:url('/_layouts/images/Menu-right.gif') no-repeat 140px 7px;
}
.cssOpen{
background:url('/_layouts/images/Menu2.gif') no-repeat 130px 7px;
}
Thank you for building such nice solution... I am hooked up with issue that the parent toggle is not navigation to its respective page it only toggle and shows the child nodes but I want the parent node to navigate to its URL. Can you please try and help me on this.
Oh my goodness! Incredible article dude! Thank you, However I am having troubles with your RSS.
I don't understand the reason why I cannot subscribe to it. Is there anybody getting similar RSS problems? Anyone that knows the answer can you kindly respond? Thanks!!
my web page - http://www.biotechnologyreview.net
This is what I am looking for! However, i am very new to sharepoint. Can someone please tell me where to put this code. I have a css file since I really don't want to mess with my master page. How do I format this for my css file or is that possible,.
Thanks
This is what I am looking for! However, i am very new to sharepoint. Can someone please tell me where to put this code. I have a css file since I really don't want to mess with my master page. How do I format this for my css file or is that possible,.
Thanks
Post a Comment