Jul 08, 2014 in Slideshow 3578 views
Slidefull is a jQuery plugin to create a simple and responsive image slideshow.
Source: github.com
1. INCLUDE CSS AND JS FILES
<link rel="stylesheet" type="text/css" href="src/jquery.slidefull.min.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script src="src/jquery.slidefull.min.js"></script>
2. HTML
<div class="slidefull-wrapper">
<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 class="slidefull-item" style="background-image: url(4.jpg);"></div>
</div>
3. JAVASCRIPT
$(".slidefull-wrapper").Slidefull();
4. OPTIONS
| Option | Type | Default | Description |
|---|---|---|---|
| duration | int | 3000 | How long each slide will show in milliseconds. |
| speed | int | 500 | Slide transition interval in milliseconds. |
| displayControls | boolean | true | Show or hide prev and next arrow controls. |
| displayPagination | boolean | true | Show or hide slide pagination. |
Tagged with:
slidefull
jquery plugin
responsive image slideshow
response
image slideshow
slideshow
simple and responsive
Related Articles
JS Tutorial