From 826310d08ba1ed468ab01b8a5c87b5396fed3a3c Mon Sep 17 00:00:00 2001 From: Brett Profitt Date: Mon, 5 Sep 2011 18:46:36 -0700 Subject: Refs #3449, #3770. Using JS to fix submenu dropdown in IE7. --- js/lib/ui.js | 34 ++++++++++++++++++++++++++++++++++ views/default/css/ie.php | 4 ++++ 2 files changed, 38 insertions(+) diff --git a/js/lib/ui.js b/js/lib/ui.js index 4426917ed..46e418e8b 100644 --- a/js/lib/ui.js +++ b/js/lib/ui.js @@ -22,6 +22,13 @@ elgg.ui.init = function () { if ($('.elgg-input-date').length) { elgg.ui.initDatePicker(); } + + // fix for ie7 CSS issue on menu dropdown + // open the menu when you hover over it, close when you click off of it. + // @todo This should be possible with CSS. Anyone want to tame the beast, go for it. + if ($.browser.msie && $.browser.version <= 7) { + $('.elgg-menu-site > .elgg-more').live('mouseenter', elgg.ui.ie7MenuFixMouseEnter) + } } /** @@ -275,5 +282,32 @@ elgg.ui.initDatePicker = function() { }); } +/** + * IE 7 doesn't like our site menu system CSS, so open it with JS. + */ +elgg.ui.ie7MenuFixMouseEnter = function() { + $('.elgg-menu-site .elgg-menu-site-more').css('display', 'block'); + $('.elgg-menu-site .elgg-more > a') + .css('background-color', 'white') + .css('color', '#555') + + $body = $('body'); + if (!$body.data('hasIe7Clear')) { + $body.live('click', elgg.ui.ie7MenuClear); + $body.data('hasIe7Clear', true); + } + +} + +/** + * Close the menu when clicking on the body + */ +elgg.ui.ie7MenuClear = function() { + $('.elgg-menu-site .elgg-menu-site-more').css('display', 'none'); + $('.elgg-menu-site .elgg-more > a') + .css('background-color', 'transparent') + .css('color', 'white') +} + elgg.register_hook_handler('init', 'system', elgg.ui.init); elgg.register_hook_handler('getOptions', 'ui.popup', elgg.ui.LoginHandler); \ No newline at end of file diff --git a/views/default/css/ie.php b/views/default/css/ie.php index 279ddfdbf..cb4ede0ae 100644 --- a/views/default/css/ie.php +++ b/views/default/css/ie.php @@ -108,6 +108,10 @@ display: inline; } +li:hover > .elgg-menu-site-more { + display: none; +} + /* admin */ .elgg-menu-footer li { display: inline; -- cgit v1.2.3