Minimal Data List Scroller Plugin - jQuery simplyScroll

File Size: 53.9 KB
Views Total: 1506
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Minimal Data List Scroller Plugin - jQuery simplyScroll

simplyScroll is a minimal yet highly customizable jQuery scroller plugin used for infinitely scrolling through a list of any web content in a fixed height container.


  • Supports both horizontal and vertical scrolling.
  • Autoplay with pause on hover support.
  • Custom controls.
  • Custom frame rate for performance.
  • Infinite scrolling.
  • Mobile & touch friendly.

How to use it:

1. Install & Download with package managers.

# Yarn
$ yarn add jquery-simplyscroll

$ npm install jquery-simplyscroll --save

2. Load the jQuery simplyScroll plugin's files into your web page.

<link rel="stylesheet" href="jquery.simplyscroll.css">
<script src="" 
<script src="jquery.simplyscroll.js"></script>

3. Create a list of web content for the scroller.

<ul id="scroller">
    <img src="1.jpg" alt="alt 1">
    <img src="2.jpg" alt="alt 2">
    <img src="3.jpg" alt="alt 3">

4. Activate the scroller by calling the function on the list.

$(function() {

5. All default options to customize the scroller.


  // default class
  customClass: 'simply-scroll',

  // No of movements per second
  frameRate: 24, 

  // Intended no. of pixels per frame (/w scroller size & requestAnimationFrame this may not be honoured)
  speed: 1, 

  // 'horizontal or 'vertical' - not to be confused with device orientation
  orientation: 'horizontal', 

  // autoplay
  auto: true,

  // if auto == true, use 'loop' or 'bounce',
  autoMode: 'loop', 

  // if auto == false, use 'loop' or 'end'
  manualMode: 'end',

  // 'forwards' or 'backwards'.
  direction: 'forwards', 

  // if autoMode == loop || bounce only
  pauseOnHover: true, 

  // touch device only
  pauseOnTouch: true, 

  // generates an extra element to allow manual pausing
  pauseButton: false, 

  // use this to delay starting of plugin until all page assets have loaded
  startOnLoad: false, 

  // initial offset in pixels
  initialOffset: 0

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