js文字滚动-怎么支持一个页面有多个滚动呢 5
我有一个文字滚动的js但是只支持页面中有一个怎么支持多个呢哪位大神能帮我改一下呢<divid="scrollDiv"><ul><li>第一行第一行第一行第一行第一行第一行...
我有一个文字滚动的js 但是只支持页面中有一个 怎么支持多个呢 哪位大神能帮我改一下呢
<div id="scrollDiv">
<ul>
<li>
第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行
</li>
<li>
第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行
</li>
<li>
第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行
</li>
<li>
第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行
</li>
<li>
第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行
</li>
<li>
第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行
</li>
</ul>
</div> 展开
<div id="scrollDiv">
<ul>
<li>
第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行
</li>
<li>
第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行
</li>
<li>
第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行
</li>
<li>
第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行
</li>
<li>
第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行
</li>
<li>
第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行
</li>
</ul>
</div> 展开
2015-02-27
展开全部
<!DOCTYPE HTML>
<html>
<head>
<title>yugi</title>
<meta charset=UTF-8 />
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.scrollDiv {
position: relative;
margin: auto;
height: 70px;
width: 50%;
overflow: hidden;
border: 1px solid black;
}
.scrollDiv ul {
position: absolute;
top: 0px;
}
.scrollDiv ul>li {
height: 24px;
}
</style>
<script type="text/javascript">
window.onload = function ()
{
var oUl = document.getElementById ('ul');
var ul1 = document.getElementById ('ul1');
var ul2 = document.getElementById ('ul2');
var t;
var funny = function (oUl, isUp, sleep)
{
if (!isUp)
{
oUl.style.top = "-22px";
oUl.insertBefore (oUl.children[oUl.children.length - 1], oUl.children[0]);
}
clearInterval (oUl.t);
oUl.t = setInterval (function ()
{
var tmp = isUp ? -22 : 3;
var speed = (tmp - (parseFloat (oUl.style.top) || oUl.offsetTop)) / 9;
if (speed > 0)
{
speed = Math.ceil (speed);
}
else if (speed < 0)
{
speed = Math.floor (speed);
}
else
{
clearInterval (t);
!!isUp ? oUl.style.top = "3px" : 0;
!!isUp ? oUl.appendChild (oUl.children[0]) : 0;
}
oUl.style.top = (parseFloat (oUl.style.top) || oUl.offsetTop) + speed + "px";
}, sleep);
}
oUl.interval = setInterval (function ()
{
funny (oUl, 1, 30);
}, 800);
ul1.interval = setInterval (function ()
{
funny (ul1, 0, 50);
}, 800);
ul2.interval = setInterval (function ()
{
funny (ul2, 1, 70);
}, 800);
}
</script>
</head>
<body>
<div class="scrollDiv">
<ul id="ul">
<li>第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行</li>
<li>第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行</li>
<li>第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行</li>
<li>第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行</li>
<li>第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行</li>
<li>第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行</li>
</ul>
</div>
<div style="top: 40px;" class="scrollDiv">
<ul id="ul1">
<li>第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行</li>
<li>第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行</li>
<li>第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行</li>
<li>第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行</li>
<li>第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行</li>
<li>第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行</li>
</ul>
</div>
<div style="top: 80px;" class="scrollDiv">
<ul id="ul2">
<li>第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行</li>
<li>第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行</li>
<li>第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行</li>
<li>第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行</li>
<li>第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行</li>
<li>第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行第六行</li>
</ul>
</div>
</body>
</html>
追问
我想一屏一屏的滚动 不是一条条的呢 可以帮我改一下吗 我这有一个现成的 只是不支持一个页面有多个 可以帮我改下吗 怎么联系你呢 代码太多 放不上去
追答
不行,我就会这个。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询