Endless Horizontal Content Scroller Plugin For jQuery - endlessRiver

File Size: 7.22 KB
Views Total: 11756
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Endless Horizontal Content Scroller Plugin For jQuery - endlessRiver

endlessRiver is a simple lightweight for generating an infinite-looping content scroller from an Html unordered list, which is great for creating a simple horizontal new sticker on your webpage.

How to use it:

1. Import jQuery library and the jQuery endlessRiver plugin's CSS & JavaScript into the webpage.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="js/endlessRiver.js"></script>
<link rel="stylesheet" href="css/endlessRiver.css"><script>

2. Create a list of html content for the scroller.

<ul id="demo">
  <li> | </li>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  ...
  <li> | </li>
</ul>

3. Call the function on the html list and done.

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

4. Available options to customize the content scroller.

$("#demo").endlessRiver({

  // scrolling speed in ms
  speed: 100,

  // pause on hover
  pause: true,

  // shows play / pause buttons
  buttons: true
  
});

Change logs:

2016-03-31

  • enhancement

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