`

先全部显示然后在滚动

阅读更多
<div id="scroll_div" style="overflow: hidden; height: 137px; width: 658px; white-space: nowrap;">
        <div id="scroll_begin" style="display: inline;">
            <img src="image/1.jpg" width="200" height="137" border="0">
            <img src="image/2.jpg" width="200" height="137" border="0">
            <img src="image/3.jpg" width="200" height="137"
                    border="0">
            <img src="image/4.jpg" width="200" height="137" border="0"><img src="image/5.jpg"
                        width="200" height="137" border="0">
            <img src="image/6.jpg" width="200" height="137"
                            border="0">
            <img src="image/7.jpg" width="200" height="137" border="0">
            <img src="image/8.jpg"
                                width="200" height="137" border="0">
        </div>
        <div id="scroll_end" style="display: inline;">
        </div>
    </div>

    <script>
var speed=1
var scroll_end = document.getElementById("scroll_end");
var scroll_div = document.getElementById("scroll_div");
scroll_end.innerHTML=scroll_begin.innerHTML
function Marquee(){
if(scroll_end.offsetWidth-scroll_div.scrollLeft<=0)
scroll_div.scrollLeft-=scroll_begin.offsetWidth
else{
scroll_div.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
scroll_div.onmouseover=function() {clearInterval(MyMar)}
scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics