我的标题中有一个下拉菜单,我希望当标题中的按钮单击时,下拉菜单会显示在该按钮下方。
该按钮位置是绝对的,我使用 jquery 位置来将该按钮置于左侧和底部。但这只是在 Firefox 中有效。为什么?
这是我的代码:
var search_div_top=($("#search-div").position().top);
var search_div_left=($("#search-div").position().left);
这是我的 CSS:
#search-div{
width:200px;
height:60px;
/*center:*/
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
margin:auto;
}
只有firefox返回该元素左右的实数,其他返回0。#search-div
的父级是relative
。
最佳答案
问题是什么?
Chrome 和其他浏览器(不是 Firefox)的问题是:
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
margin:auto;
使用上面的 CSS,div 将显示在其父级的中心,如果您在上面的代码中看到我们有 left:0
和 right:0
并且 chrome 会看到这一点代码并获取其中之一,并从左或右开始,值为 0。
那么,解决方案是什么:
jquery中有一个获取元素位置的函数,只需使用以下代码:
var search_div_top=($("#search-div").offset().top);
var search_div_left=($("#search-div").offset().left);
关于javascript - 位置在 Firefox 中工作良好,但在其他浏览器中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29582208/