是否可以使用 jQuery 和 CSS 将一个 div 一分为二,然后分别为这两部分制作动画?
为了更好地解释,请看这张图:
如有任何帮助,我们将不胜感激 - 提前致谢。
最佳答案
您可以像这样用一对容器 div 伪造它: jsFiddle example .
HTML
<div id="top"><div>Some text here</div></div>
<div id="bottom"><div>Some text here</div></div>
CSS
#top,#bottom {
background: #333;
width:200px;
height:100px;
position:relative;
overflow:hidden;
}
#top div {
position:relative;
top: 90px;
color:#eee;
text-align:center;
}
#bottom div {
position:relative;
top: -10px;
color:#eee;
text-align:center;
}
jQuery
$('#bottom').delay(2000).animate({
bottom: '-200px'
},4000);
$('#top').delay(2000).animate({
top: '-200px'
},4000);
关于javascript - jQuery 将 div 切片成动画片段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11087238/