Source code:
Css:
Copy codeThe Code is as follows:
* {Padding: 0; margin: 0; font-size: 12px ;}
. Do_ta {border: 1px solid # E4E4E4; margin: 10px auto; width: 170px ;}
. Do_ta. ta_ta {background: url ("http://s.zbjimg.com/p/zbj/css/../img/tafb.gif") no-repeat; height: 52px; width: 168px ;}
. Do_ta. ta_tc {height: 61px; line-height: 20px; margin: 10px; overflow: hidden; padding: 0; position: relative ;}
. Do_ta. ta_tc li {border-bottom: 1px dashed # E4E4E4; color: #666666; height: 60px; margin: 0; overflow: hidden; padding: 0; position: absolute; top: 0; left: 0; background: # fff; z-index: 0; width: 155px ;}
. Do_ta. ta_tc li. time {color: #999999 ;}
. Do_ta. ta_tc li u {color: #2B9A00; text-decoration: none ;}
. Do_ta. ta_tc li s {color: # FF3600; text-decoration: none ;}
. Do_ta. ta_tc li a {color: # 1A69DE; text-decoration: none ;}
. Do_ta. dota_d {padding: 5px 0 15px; text-align: center ;}
. Do_ta. dota_d a {color: #666 ;}
Javascript:
Click my js tool library!
Copy codeThe Code is as follows:
Meng. extend ({
ZbjScrollText: function (scrollId ){
Var li = Meng. getTag ('lil', Meng. getId (scrollId )),
CurActLi = 0,
GetActivity = function (){
Return [li [curActLi], li [10 + curActLi], li [20 + curActLi], li [30 + curActLi];
},
SliceDown = function (elem, pos ){
Meng. setStyle (elem, {top: '-60px', zIndex: 1 });
Meng. animate (elem, {top:-60}, {top: 60}, 800 );
},
Play = function (){
Meng. each (getActivity (), function (I ){
Var _ this = this;
SetTimeout (function (){
SliceDown (_ this, I );
}, I * 900 );
});
};
Play ();
SetInterval (function (){
If (curActLi = 9 ){
CurActLi = 0;
Meng. each (li, function () {Meng. setStyle (this, {zIndex: 0 })});
} Else curActLi ++;
Play ();
},5000 );
}
});
Meng. zbjScrollText ('dota1 ');