div轮流滚动显示
window.onload = function(){ var _box1 = document.getElementById("box1"); var _box2 = document.getElementById("box2"); var y = 0; var fun = function(){ _box1.style.top = y + 'px'; _box2.style.top = (y + 420) + 'px'; y--; if((y + 420) == 0){ y = 0; } } setInterval(fun,20); }
html部分
<div class="scroll_box" id="scroll_box"> <div id="box1"> <p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx </p> </div> <div id="box2">
<p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx </p>
</div>
</div>
css部分
#scroll_box { margin: 16px; position: relative; width: 468px; height: auto; } #scroll_box #box1, #scroll_box #box2 { position: absolute; height: 420px; } #scroll_box #box1 { top: 0; } #scroll_box #box2 { top: 420px; }