我正在尝试使用此下拉菜单：http://ttb.li/dump/buttons/dropdown.html
在我的网站上，这看起来很好并且可以正常工作，但是打开的窗口放置在不正确的高度并且非常靠右（在我的网站上）。在 jsfiddle 上它只是放置得太高了，但至少水平是正确的。
代码：http://jsfiddle.net/EA6LS/1/
我从网站的演示中复制并粘贴了这个，我看不到我可能遗漏的任何内容......感谢您的想法。
更新
好吧，我只是想到了一些事情。在我的网站上，我将页面宽度定义为 900 像素。如果我在 firefox 上使用“inspect”，我可以看到 JS 为下拉菜单分配了 215px（给或取）左边距。这在我的屏幕上可能是准确的。但是，它会将元素移动到我定义的 900px 区域的左侧，而不是在我的屏幕上......所以这可能是 relative 与 absolute 的问题吗？
【问题讨论】：
标签： jquery css drop-down-menu
您可以删除定位下拉菜单的 JavaScript 代码，然后在 CSS 中定义它。如果你相对定位.dropdown，.dropdown_content 将相对于它的父定位，这使得定位很容易：
.dropdown {
...
position: relative;
}
.dropdown .dropdown_content {
...
top: 100%;
left: 0;
margin: 5px 0;
}
删除这些 JavaScript 行：
var o = $(this).parent().find('.dropdown_button').offset();
var h = $(this).parent().find('.dropdown_button').height();
$(this).parent().find('.dropdown_content').css({'top':(o.top+h-1),'left':o.left});
（这是您的内联 top 和 left 值的来源。）
另外，从您的 body 样式定义中删除 overflow: hidden。
工作演示： http://jsfiddle.net/gilly3/EA6LS/2/
我通常也认为取消选中 jsfiddle 中的“规范化 CSS”是个好主意。调试 CSS 时，可能会导致令人困惑的结果。
当您使用它时... JavaScript 可以被简化：http://jsfiddle.net/gilly3/EA6LS/4/
【讨论】：
li 样式定义中设置white-space: nowrap;：jsfiddle.net/gilly3/EA6LS/5
下拉列表中的内容的顶部边距为 11 像素，但目前我无法确定它的定义位置。
在 css 中正确定义它似乎可以解决您的高度偏移问题。
.dropdown.open .dropdown_content {
display: block;
margin-top: 11px;
}
编辑：似乎在 chrome 中用户代理的 ul、menu 和 dir 样式表具有
-webkit-margin-before: 1em;
这是罪魁祸首（至少对我来说）
EDIT2：他们已经内联了 css（通过 jQuery 以错误的方式），这也是你得到偏移错误的原因
<ul class="dropdown_content" style="top: 135px; left: 164px; ">
请参阅this jsfiddle 以获取“正确”外观下拉菜单。根据评论，以下是更改（请注意，在 javascript 中，我删除了设置下拉内容顶部的部分）：
CSS
.dropdown.open .dropdown_content {
display: block;
margin-top: 0px;
}
javascript
$(this).parent().find('.dropdown_content').css({'left':o.left});
【讨论】：