jQuery Plugin To Create Auto Scrolling Background - backgroundScroll

backgroundScroll.js is a lightweight jQuery plugin to automatically and continuously scroll your background image with specified speed and direction.

Basic usage:

1. Include the autoBackgroundScroll.js file after the jQuery JavaScript library as shown in the code snippet below

<script src="jquery.min.js"></script>
<script src="js/backgroundScroll.js"></script>

2. Add a background image to your container.

body {
  background-image: url(bg.jpg);
  background-position: 0px 0px;
}

3. Call the plugin on the container to start an animated background with a continuous scrolling effect.

$('body').backgroundScroll(OPTIONS);

4. Config the auto scrolling effect.

$('body').backgroundScroll({

  // set to 'true' if you want to scroll the pattern image
  pattern: false,

  // bind to click event or not
  click: false,

  // image path
  img: '',

  // animation speed
  speed: 1,

  // animation duration
  duration: 10,

  // 'right' or 'left'
  directionX: '',

  // 'top' or 'bottom'
  directionY: '',

  // width/height of image
  imageWidth: 0,
  imageHeight: 0,
  
  position: ''

});

Change log:

2016-07-18

• API update.

2016-02-17

• refactor

2016-01-03

• bugfix

2015-09-05

• bugfix

2015-07-29

• added more options

---

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