我有<div>元素作为页面，以及“下一步”和“后退”按钮在它们之间切换。单击“下一页”按钮时，当前页面淡出，下一页淡入，使用 jQuery。正如我到目前为止所做的那样，确保 div 彼此重叠而不是彼此相邻的唯一方法是设置它们的样式 position:absolute .然而，这会强制 div 也覆盖页面上的任何其他内容，否则它们会被推开。
有什么方法可以使 div 基本上仅相对于彼此绝对定位，并且仍然表现得好像它们相对于页面的其余部分定位一样？我试过将它们放在一个相对定位的容器中，但 div 溢出了它们的容器，使其或多或少变得无用。
编辑:
基本 fiddle :http://jsfiddle.net/9AXS4/4/
是的，我搞混了$和 jQuery .在调用 jQuery.noConflict() 之后我一直在使用 jQuery
最佳答案
如果您的页面(如您所说)具有固定的宽度和高度，那么您可以将它们的容器设置为position:relative 并且宽度和页面高度..
.container{
position:relative;
width:500px; /*the total width of a page, including padding and borders*/
height:400px; /*the total height of a page, including padding and borders*/
}
这样容器元素将处理其他元素的插入
这是您更正后的 fiddle :http://jsfiddle.net/gaby/9AXS4/2/
(容器的宽度/高度必须考虑页面元素上的填充和边框)
此外，您使用 .pagecontainer 而不是 #pagecontainer 定位容器(因为您使用了 id)
更新(在评论任意高度之后..)
由于您的页面高度不固定，您需要求助于 jQuery 来调整容器的大小。
这是一个完整的演示:http://jsfiddle.net/gaby/9AXS4/7/
关于javascript - 使 div 仅对彼此绝对，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17433672/