Controls image scrolling from left to right

Jquery encapsulates a plug-in that controls the left and right scrolling of images:

<! Doctype HTML> <Style> * {padding: 0; margin: 0; List-style: None} IMG {border: None} # IMG-slider, # img-slider-2 {position: relative; width: 560px; Height: 80px ;}. slider-wrap {width: 480px;/* The width value must be the same as the sum of all Li widths */overflow: hidden; position: relative; Height: 150px; margin-left: 40px ;}. slider-wrap ul {ZOOM: 1; position: absolute; left: 0; top: 0; width: 9999px ;}. slider-wrap ul Li {float: Left; width: 120px; text-align: center; padding: 5px 0 ;}# Prev, # Next {position: absolute; top: 30px; left: 0px; width: 40px }# next {left: auto; Right: 0px} </style>
<SCRIPT type = "text/JavaScript"> $ (function () {$ ("# IMG-slider "). imgscroll (); $ ("# img-slider-2 "). imgscroll () ;});/* plug-in */(function ($) {$. FN. imgscroll = function () {var isdone = false, scrollbox = $ (this), prevbtn = scrollbox. find ("# Prev"), nextbtn = scrollbox. find ("# Next"), imgbox = scrollbox. find ("Ul"), next_over = imgbox. find ("Li "). width () * imgbox. find ("Li "). length, slide_width = $ (". slider-wrap "). width (); Return this. each (function () {function setopacity () {imgbox. animate ({opacity: 1}, 800, function () {isdone = false ;})} function scrollnext () {If (! Isdone & next_over + parseint(imgbox.css ("Left"), 10)> slide_width) {isdone = true; imgbox. animate ({left: "+ =" + "-" + slide_width, opacity: 0.5}, 800, setopacity);} // isdone = false} function scrollprev () {If (! Imgbox. Is (': animated') & parseint(imgbox.css ("Left"), 10 )! = 0) {imgbox. animate ({left: "+ =" + slide_width, // shift left opacity: 0.5}, 800, setopacity) ;}} prevbtn. BIND ('click', scrollprev); // scroll forward to nextbtn. BIND ('click', scrollnext); // scroll back}) (jquery ); </SCRIPT>