Summary of rolling effect method in JS

Three: Using SetInterval function to realize

The code is as follows

Copy Code

<ul id= "AAA" > <li> This is the first line of the bulletin title </li> <li> This is the second line of the bulletin title </li> <li> This is the third line of the bulletin title </li> <li> This is the fourth line of the bulletin title </li> <li> This is the fifth line of the bulletin title </li> <li> This is the sixth line of the bulletin title </li> <li> This is the seventh line of the bulletin title </li> <li> This is the eighth line of the bulletin title </li> </ul> <script> SetInterval ("Aaa.appendchild (Aaa.firstchild)", 500); </script>

Note: an extended

The code is as follows

Copy Code

JQuery.fn.extend ({ Justup:function (aspeed,duration) { This.css ({"Height": "25px", "Line-height": "25px"}); This.each (function () { var _this = this; var itimer=0; function Scroll () { Itimer = setinterval (function () { $ (_this). Animate ({margintop: " -25px"},aspeed| | 500,function () {$ (_this). css ({margintop: "0px"}). Find ("Li:first"). Appendto (_this); },duration| | 3000); } Scroll (); $ (this). Hover (function () {this.style.cursor = "pointer"; clearinterval (Itimer);},scroll); }); } });

Horizontal scrolling

code is as follows

copy code

//horizontal scrolling plug-in (function ($) { $.fn.extend ({ Scroll:function ( Opt,callback) { //parameter initialization if (!opt) var opt={}; var _btnright = $ ("#" + opt.right);//shawphy: Right button var _btnleft = $ ("#" + opt.left);//shawphy: Left Button var timerid; var _this=this.eq (0). Find ("Ul:first"); var      linew=_this.find ("Li:first"). Width (),//Get list width Line=opt.line?parseint (opt.line,10):p Arseint ( This.width ()/linew,10),////per scrolling number of rows, default to one screen, that is, the parent Container height Speed=opt.speed?parseint (opt.speed,10): 500;//scrolling speed, larger value , the slower (milliseconds)  timer=opt.timer//?parseint (opt.timer,10): 3000;//scrolling interval (milliseconds) if (line==0) line=1; Var Rightwidth=0-line*linew;