关于用javascript做一个滚动小动画

品味人生 • 发布于 2019-02-01 21:37:02

这个家伙很害羞,不想介绍自己!

源代码如下:
<div class="margee_up">
<ul class="details">
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
</ul>
<!--more-->
<ul class="details">
<ul class="details">
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
<li>14:00岑**青岛-石家 硬卧下2张</li>
</ul>
</ul>
<div class="cls"></div>
</div>
脚本如下

&lt;script&gt;
var speed22=50
details22.innerHTML=details11.innerHTML
function Marquee22(){
if(details22.offsetTop-Margee_up.scrollTop&lt;=0)
Margee_up.scrollTop-=details11.offsetHeight
else{
Margee_up.scrollTop++
}
}
var MyMar22=setInterval(Marquee22,speed22)
Margee_up.onmouseover=function() {clearInterval(MyMar22)}
Margee_up.onmouseout=function() {MyMar22=setInterval(Marquee22,speed22)}
&lt;/script&gt;

css 如下
.margee_up {width:235px;margin:0 auto; margin-top:10px; height:206px;overflow:hidden;}
#main #ticketdetail ul.details {
font-size: 16px;
color: #FFF;
}
#main #ticketdetail ul.details li{
height:26px;
line-height:26px;
}
#main #ticketdetail ul.details a {
color: #FFF;
}

做好之后就可以由下像上滚动了 如果要改为向左 向右 直接可以修改 if里面的条件句!!