Есть простое самописное меню:
<div class="b-menu">
<!-- main menu -->
<div class="b-main-menu">
<a href="javascript:void(0);" onmouseover="menu.showSubMenu('item1');">item1</a>
<a href="#">item2</a>
<a href="javascript:void(0);" onmouseover="menu.showSubMenu('item2');">item3</a>
</div>
<div class="menu-delimiter"></div>
<!-- sub menu -->
<div class="b-sub-menu hidden" id="item1">
<a href="design-projects.html">subitem1</a>
<a href="programming-projects.html">subitem2</a>
</div>
<div class="b-sub-menu hidden" id="item2">
<a href="about-us.html">subitem3</a>
<a href="technologies.html">subitem4</a>
<a href="contact.html">csubitem5</a>
</div>
<!-- sub menu -->
<div class="clear"></div>
</div>
Код инициализации меню:
var menu = $('.b-menu').initmenu('item1');
Код самого плагина меню:
(function($) {
$.fn.initmenu = function(options) {
options = $.extend({current: ''}, options);
this.each(function(){
$(this).mouseleave(function(event){
// 1. hide all sub menu
$('.b-sub-menu').addClass('hidden');
if(options.current != '') {
// 2. show current menu
$('#' + options.current).removeClass('hidden');
}
})
})
this.showSubMenu = function(idSubMenu){
if(idSubMenu != '') {
// 1. hide all sub menu
$('.b-sub-menu').addClass('hidden');
// 2. show current menu
$('#' + idSubMenu).removeClass('hidden');
}
}
// 1. open current sub menu
this.showSubMenu(options.current);
return this;
}
})(jQuery);
Так вот трабл в IE6, а именно когда я убираю фокус с любой из ссылок блока b-main-menu. Event bubbling добирается до события $(this).mouseleave(function(event) в плагине и тот прячет подменю. Не совсем понимаю как это можно пофиксить. Читал много о bubbling, сам механизм понятен. Нашел тему -
вопрос по вспливанию, однако я не могу в ie6 вообще как-то просмотреть объект event. Подскажите как решить данную проблему?