endless-river

2.0.0 • Public • Published

EndlessRiver v 2.0.0

A jQuery content scroller!

Index

Introduction

Endless river is a jQuery plugin, that animates content and make it scroll endlessly!

The usefull feature is that you don't have to set widths to elements, because speed is set in pixel/second!!

EndlessRiver will calculate the best width for the <li> element and keep speed constant!

Requirements

The only requirement needed is jQuery that you can install it via Bower.

Installation

You can download the source files, or install via npm by running

npm i endlessRiver

Usage

Simply include the endlessRiver JS and CSS

<html>
    <head>
        <script type="text/javascript" src="path-to/js/endless-river.min.js"></script> 
        <link type="text/css" rel="stylesheet" href="path-to/css/endless-river.min.css" />
    </head>
</html>

Create an <ul> list like this

<ul id="myUl">
    <li> | </li>
    <li style="color: red">Espresso</li>
    <li style="color: orange">Cappuccino</li>
    <li style="color: yellow">American</li>
    <li style="color: green">Tea</li>
    <li style="color: black">Milk</li>
    <li style="color: blue">Juice</li>
    <li> | </li>
</ul>

and call it like this!

$(document).ready(function(){
    $("#myUl").endlessRiver();
});

Params

option description type default
speed Speed of animations in pixel/second Number 100
pause Pause on hover: if true, scrolling will stop on mouseover Boolean true
buttons If true, shows play/stop buttons Boolean false

Changelog

v 2.0.0

  • code refactored
  • added gulpfile
  • added minified files
  • added demo page

License

Check out LICENSE file (MIT)

Package Sidebar

Install

npm i endless-river

Weekly Downloads

8

Version

2.0.0

License

MIT

Unpacked Size

14.7 kB

Total Files

7

Last publish

Collaborators

  • tonysamperi