Responsive Full Page Image Slideshow with jQuery - Slidefull

File Size: 2.95 MB
Views Total: 833
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Responsive Full Page Image Slideshow with jQuery - Slidefull

Slidefull is a jQuery plugin that allows you to create a full page and fully responsive background image slideshow on your website.

How to use it:

1. Load the latest version of jQuery library and the jQuery slidefull plugin in the page.

<link rel="stylesheet" href="src/slidefull.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="src/slidefull.min.js"></script>

2. Create the Html for a background image slideshow.

<div class="demo">
  <div class="slidefull-item" style="background-image: url(1.jpg);"></div>
  <div class="slidefull-item" style="background-image: url(2.jpg);"></div>
  <div class="slidefull-item" style="background-image: url(3.jpg);"></div>
  ...
</div>

3. Call the plugin on the parent element.

$(".demo").Slidefull();

4. Options available.

auto: true,
prev: null,
next: null,
speed: 500,
duration: 3000,
displayControls: true,
displayPagination: true

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