我试图将一个DIV定位到屏幕外,以便使用JQuery动画在屏幕上/下(水平方向)“滑动”多个DIV… 但是,我遇到了问题,因为第二个DIV创建滚动条,即使它有负的上边距。
所有元素都相对定位(也许这就是我的问题?)。被滑动的第一个主要DIV位于中心,具有margin:auto,并具有顶部偏移量以帮助垂直居中。
第二个DIV具有right:5000以将其移出屏幕。 但由于它处于正常流中,因此仍会导致垂直滚动条,即使使用top:-10000。 我尝试了overflow:hidden,但没有成功,不知道还能做什么。(如果动态内容增长,我不想完全禁用滚动条。)
示例CSS
这里有一个JSFiddle,其中包含我正在处理的简化版本。示例JS Fiddle 这似乎应该非常简单,但也许是因为我今天已经工作太久了,在搜索时忽略了一些东西。 奖励 如果有人对另一种使这种情况发生的方法(DIV滑出屏幕,另一个取代它)有建议,那也可以!
所有元素都相对定位(也许这就是我的问题?)。被滑动的第一个主要DIV位于中心,具有margin:auto,并具有顶部偏移量以帮助垂直居中。
第二个DIV具有right:5000以将其移出屏幕。 但由于它处于正常流中,因此仍会导致垂直滚动条,即使使用top:-10000。 我尝试了overflow:hidden,但没有成功,不知道还能做什么。(如果动态内容增长,我不想完全禁用滚动条。)
示例CSS
#maincontent {
position: relative;
width: 100px;
height: 250px;
margin: auto;
top: 100px;
background-color:black;
}
#maincontent2 {
position: relative;
width: 100px;
height: 250px;
margin: auto;
background-color:blue;
top: -1000px
}
body{
position:relative;
}
示例HTML
<body>
<div id="maincontent"></div>
<div id="maincontent2"></div>
</body>
这里有一个JSFiddle,其中包含我正在处理的简化版本。示例JS Fiddle 这似乎应该非常简单,但也许是因为我今天已经工作太久了,在搜索时忽略了一些东西。 奖励 如果有人对另一种使这种情况发生的方法(DIV滑出屏幕,另一个取代它)有建议,那也可以!