Seamless List Scrolling Plugin For jQuery - kxbdmarquee.js

kxbdmarquee.js is a lightweight, cross-browser jQuery plugin which provides a seamless/infinite/endless scrolling experience on your long html list. Similar to the legacy marquee element. Great for news ticker, quote scroller, image slider and many more. Also features autoplay, pause on hover, 4 directions and configurable scrolling animations.

How to use it:

1. Wrap your long html list into a DIV container like this:

<div id="demo">
  <ul>
    <li><img src="1s.jpg"></li>
    <li><img src="2s.jpg"></li>
    <li><img src="3s.jpg"></li>
    <li><img src="4s.jpg"></li>
    <li><img src="5s.jpg"></li>
    ...
  </ul>
</div>

2. Include both jQuery library and the jQuery kxbdmarquee.js right before the closing body tag.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.kxbdmarquee.js"></script>

3. Call the function kxbdMarquee on the top container and done.

$("#demo").kxbdMarquee();

4. Set the scroll direction.

$("#demo").kxbdMarquee({

  //"left", "right", "up", "down"
  direction: "left"

});

5. Specify how many times you want to loop though the list.

$("#demo").kxbdMarquee({

  // 0 = infinite loop
  loop: 0,

});

6. Config the scroll animation.

$("#demo").kxbdMarquee({

  // step size
  scrollAmount:1,

  // animation delay
  scrollDelay:20

});

---

This awesome jQuery plugin is developed by erdouzhang. For more Advanced Usages, please check the demo page or visit the official website.