CS-14877: Focus browser panel on breadcrumb hover

When mouse is over a breadcrumb for a period of > 2s, show its
respective panel until mouseout. This allows a user to see the
contents of the panel without having to select it.

reviewed-by: brian

Original commit:
commit 88be929e04826cd1159a2db7dbca220f7eadf5fd
Author: Pranav Saxena <pranav.saxena@citrix.com>
Date: Fri Jun 8 14:17:42 2012 +0530

    CS-14877: Expanded breadcrumb navigation on hover UI Requirement
This commit is contained in:
Brian Federle 2012-06-11 12:52:10 -07:00
parent 7b9b3c1e1d
commit d7f00f2c45
1 changed files with 28 additions and 0 deletions

View File

@ -384,4 +384,32 @@
}
}
));
// Breadcrumb hovering
$('#breadcrumbs li').live('mouseover', cloudStack.ui.event.bind(
'cloudBrowser',
{
'breadcrumb': function($target, $browser, data) {
var $hiddenPanels = data.panel.siblings().filter(function(){
return $(this).index() > data.panel.index();
});
$hiddenPanels.addClass('mouseover-hidden');
setTimeout(function() {
$('.mouseover-hidden').hide("slow");
} ,2000);
}
}
));
$('#breadcrumbs li').live('mouseout',cloudStack.ui.event.bind(
'cloudBrowser',
{
'breadcrumb': function($target, $browser, data) {
var $getHiddenPanels = $browser.find('.panel.mouseover-hidden');
$getHiddenPanels.removeClass('mouseover-hidden').show();
}
}
));
})(jQuery, cloudStack);