Skip to content

Latest commit

 

History

History
81 lines (61 loc) · 1.91 KB

README.md

File metadata and controls

81 lines (61 loc) · 1.91 KB
Raw

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

  • files renamed to kebab-case
  • code refactored
  • added gulpfile
  • added minified files
  • added demo page

License

Check out LICENSE file (MIT)