我正在开展一个元素,我们正在抓取网站并提取内容,因此我无法控制 div 或 lis 的结构。
我遇到的问题是菜单上的下拉菜单没有与父菜单项左对齐。我正在寻找一些有助于解决此问题的 css/jquery,here's a link to the fiddle: http://jsfiddle.net/9gQCH/3/
CSS 和 HTML
#item1, #item2 {
background-color:#efefef;
display:inline;
font-size:14px;
margin-right:3px;
padding:5px;
}
.Submenu {
display: none;
padding: 4px;
margin-top:18px;
background-repeat:no-repeat;
}
.Menu li:hover .Submenu{
background-color:orange;
display:inline;
color: black;
padding: 3px 5px;
position:absolute;
}
<div class="Menu">
<li id="item2">
High level Item 1
<div class="Submenu">
<div>
Nested Item 1
</div>
<div>
Nested Item 2
</div>
</div>
</li>
<li id="item2">
High level Item 2
<div class="Submenu">
<div>
Nested Item 3
</div>
<div>
Nested Item 4
</div>
</div>
</li>
</div>
最佳答案
使用 JQuery
$(".Submenu").each(function(){
$(this).css("left",$(this).parent().offset().left);
});
关于jquery - 使用 jQuery 根据父位置在子 li 上设置边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13424406/