jQuery Plugin To Show A Popup When Scrolling Down - slidebox

slidebox is a lightweight jQuery plugin that shows a sliding popup box when your user scrolls down and reaches a specific point (e.g. bottom) of the webpage. Check out this jQuery plugin If you'd like to have a popup that shows instantly when the page opens.

How to use it:

1. Place jQuery library and the jQuery slidebox plugin's script at the end of the document so the page loads faster.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.slideBox.js"></script>

2. Insert your own content (e.g. subscription box, contact form, featured posts) to the popup box.

<div id="slidebox">
  Your content here
</div>

3. Style the popup box whatever you like.

#slidebox {
  ...
}

4. Initialize the plugin and specify at which point you want to show the popup box.

$('#slidebox').slideBox({

  // top position in pixels or elements
  target: 1250,

});

5. Specify the position where to place the popup box.

$('#slidebox').slideBox({

  // [bottom|middle|top] and [left|center|right]
  position: 'bottom right',

});

6. Specify the sliding direction.

$('#slidebox').slideBox({

  // or 'left'
  appearsFrom: 'right',

});

7. Specify the animation speed in milliseconds.

$('#slidebox').slideBox({

  slideDuration: 1500

});

8. Specify the the closing element.

$('#slidebox').slideBox({

  closeLink: '#close'

});

9. Events.

$('#slidebox').slideBox()
.on('sb.hidden', function() {
  // when hidden
}).on('sb.shown', function() {
  // when shown
});

---

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