Javascrit文字水平滚动实现

看到别人做的水平滚动似乎和简单.确实很简单,那是因为别人会了.自己不会,那就先理解别人的代码吧.

<div id="rbb" style=" float: left;

background: #FFF;

overflow:hidden;

border: none;

height: 21px;

width: 321px;

">

<div id="indemo" style="float: left; width: 1500%;">

<div id="demoa" style="float: left;">

<asp:Repeater ID="repeaterHotMusic" runat="server">

<ItemTemplate>

<span class="olid">

<%#Eval("olid") %></span> <a href="#">

<%#Eval("title")%></a>

<%#Eval("singer")%>&nbsp;

</ItemTemplate>

</asp:Repeater>

</div>

<div id="demob" style="float: left;">

</div>

</div>

</div>

<script type="text/javascript" language="javascript">

var speed = 30;

var tab = document.getElementById("rbb");

var tab1 = document.getElementById("demoa");

var tab2 = document.getElementById("demob");

tab2.innerHTML = tab1.innerHTML;

function Marquee() {

if (tab2.offsetWidth - tab.scrollLeft <= 0)

tab.scrollLeft -= tab1.offsetWidth

else {

tab.scrollLeft++;

}

}

var MyMar = setInterval(Marquee, speed);

tab.onmouseover = function () { clearInterval(MyMar) };

tab.onmouseout = function () { MyMar = setInterval(Marquee, speed) };

</script>

特别注意的是: indemo的宽度以及几个div的顺利及样式.