new UI - add highlighted class to first level menu when it's expanded.

This commit is contained in:
Jessica Wang 2010-10-13 18:25:00 -07:00
parent a9de7cbd23
commit a7656e01f0
2 changed files with 23 additions and 20 deletions

View File

@ -256,10 +256,10 @@ long milliseconds = new Date().getTime();
</div>
</div>
</div>
<div class="leftmenu_list">
<div class="leftmenu_content highlighted">
<div class="leftmenu_list" id="expandable_first_level">
<div class="leftmenu_content" id="expandable_first_level">
<div class="leftmenu_firstindent">
<div class="leftmenu_arrows close" id="expanded_arrow_icon">
<div class="leftmenu_arrows close" id="expandable_first_level_arrow">
</div>
<div class="leftmenu_list_icons">
<img src="images/instance_leftmenuicon.png" alt="Instance" /></div>
@ -296,9 +296,9 @@ long milliseconds = new Date().getTime();
</div>
</div>
<div class="leftmenu_list">
<div class="leftmenu_content">
<div class="leftmenu_content" id="expandable_first_level">
<div class="leftmenu_firstindent">
<div class="leftmenu_arrows close" id="expanded_arrow_icon">
<div class="leftmenu_arrows close" id="expandable_first_level_arrow">
</div>
<div class="leftmenu_list_icons">
<img src="images/storage_leftmenuicon.png" alt="Storage" /></div>
@ -342,9 +342,9 @@ long milliseconds = new Date().getTime();
</div>
</div>
<div class="leftmenu_list">
<div class="leftmenu_content">
<div class="leftmenu_content" id="expandable_first_level">
<div class="leftmenu_firstindent">
<div class="leftmenu_arrows close" id="expanded_arrow_icon">
<div class="leftmenu_arrows close" id="expandable_first_level_arrow">
</div>
<div class="leftmenu_list_icons">
<img src="images/templates_leftmenuicon.png" alt="Template" /></div>
@ -464,9 +464,9 @@ long milliseconds = new Date().getTime();
</div>
</div>
<div class="leftmenu_list">
<div class="leftmenu_content" id="leftmenu_domain">
<div class="leftmenu_content" id="expandable_first_level">
<div class="leftmenu_firstindent">
<div class="leftmenu_arrows close" id="expanded_arrow_icon">
<div class="leftmenu_arrows close" id="expandable_first_level_arrow">
</div>
<div class="leftmenu_list_icons">
<img src="images/domain_leftmenuicon.png" alt="Domain" /></div>
@ -490,9 +490,9 @@ long milliseconds = new Date().getTime();
</div>
</div>
<div class="leftmenu_list">
<div class="leftmenu_content">
<div class="leftmenu_content" id="expandable_first_level">
<div class="leftmenu_firstindent">
<div class="leftmenu_arrows close" id="expanded_arrow_icon">
<div class="leftmenu_arrows close" id="expandable_first_level_arrow">
</div>
<div class="leftmenu_list_icons">
<img src="images/events_leftmenuicon.png" alt="Event" /></div>
@ -525,9 +525,9 @@ long milliseconds = new Date().getTime();
</div>
</div>
<div class="leftmenu_list">
<div class="leftmenu_content highlighted">
<div class="leftmenu_content" id="expandable_first_level">
<div class="leftmenu_firstindent">
<div class="leftmenu_arrows open" id="expanded_arrow_icon">
<div class="leftmenu_arrows open" id="expandable_first_level_arrow">
</div>
<div class="leftmenu_list_icons">
<img src="images/configuration_leftmenuicon.png" alt="System" /></div>

View File

@ -1,13 +1,16 @@
$(document).ready(function() {
$("#leftmenu_container").find("#expanded_arrow_icon").bind("click", function(event) {
var $submenu = $(this).parent().parent().siblings(".leftmenu_expandedbox");
if($submenu.css("display") == "none") {
$(this).removeClass("close").addClass("open");
$submenu.show();
$("#leftmenu_container").find("#expandable_first_level").bind("click", function(event) {
var $firstLevelMenu = $(this);
var $secondLevelMenu = $firstLevelMenu.siblings(".leftmenu_expandedbox");
if($secondLevelMenu.css("display") == "none") {
$firstLevelMenu.find("#expandable_first_level_arrow").removeClass("close").addClass("open");
$firstLevelMenu.addClass("highlighted");
$secondLevelMenu.show();
}
else {
$(this).removeClass("open").addClass("close");
$submenu.hide();
$firstLevelMenu.find("#expandable_first_level_arrow").removeClass("open").addClass("close");
$firstLevelMenu.removeClass("highlighted");
$secondLevelMenu.hide();
}
return false;
});