这个页面有一些 jQuery 制作成菜单的 div。
Here是 jsfiddle。
<div class="span-24 last">
<div class="span-5 last menu_button">
<ul id="item_menu" class="ui-menu">
<li class="ui-menu-item"><a href="#">Select Item Here</a>
<ul id="item_menu_list" class="ui-menu" style="display:block; position:relative;"></ul>
</li>
</ul>
</div>
使用这些参数:
$( "#item_menu" ).menu("collapseAll", null, true );
菜单被清除并重置:
$('#item_menu').html("");
$('#item_menu').append("<li class=\"ui-menu-item\"><a href=\"#\">Item Menu</a><ul id=\"item_menu_list\" class=\"ui-menu\" style=\"display:block; position:relative;\"></ul></li>");
然后通过这样的一系列调用填充:
$('#item_menu_list').append("<li class=\"ui-menu-item\"><a class=\"ui-corner-all\" id=\"item_menu_list_item1\" href=\"#item1\">Item 1</a></li>");
.menu_button
具有以下 .css:
div
{
color:#3079D9;
/* background:#4334ff; */
border-image-width:0px;
}
#menu
{
height:32px;
/* background:#00ccff; */
padding-top:10px;
padding-bottom:10px;
border-bottom: 1px solid #3079D9;
position: relative;
z-index:5000;
}
#menu div
{
position: relative;
vertical-align:middle;
z-index: inherit;
}
.menu_button {
/* padding:10px; */
position: relative;
vertical-align:middle;
/*z-index: inherit;*/
margin-top:0px;
color:#F2F2F2;
background: #5A86BF;
text-align:center;
border: 1px solid #3079D9;
border-image-width:0px;
}
其余的 .css 是从 Blueprints css 或 jQuery-ui css 中提取的。
我使用的是 jQuery UI v.1.10.3 和 jQuery v1.10.2。
每当我将鼠标悬停在下拉菜单上时,就会出现一个空白区域,就像它应该的那样,但是菜单项的文本在菜单右侧显示为整个菜单的宽度。直到几天前,它还在正常工作。但是当我从 jQuery v.1.9.1 切换时,因为我的 jQuery 工具提示不起作用,我的菜单坏了。有谁知道是什么导致了这种情况?
如果您需要任何其他信息,请告诉我。
最佳答案
对你的 fiddle 所做的修改
已添加
#item_menu_list { width:188px; }
到您的 CSS -(使您的菜单链接与菜单的大小相同。您可以根据需要修改它。)从附加的
li
中删除了所有类元素。当菜单激活时,它会自动为您添加这些类。一些冲突导致了您的问题。删除了
class
和style
来自item_menu_list
的属性元素。<ul id="item_menu_list"></ul>
类和样式,并由菜单自动添加,就像附加元素一样。添加了一个
position
属性到您的菜单。$('#item_menu').menu({ position: { my: "bottom", at: "right-95 top-3" } });
这使您可以调整菜单打开的位置,以便它在正下方打开,但您可以对其进行试验。$('#item_menu').menu();
默认为右侧打开的菜单。
这是 fiddle 。
希望这对你有帮助。
关于javascript - jQuery 下拉菜单显示不正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19369866/