The Nivoo-Slider is an image gallery based on the jQuery Plugin NivoSlider (http://nivo.dev7studios.com/). It features 18 different transition effects.
Just include NivooSider.js and the NivooSlider.css to your the head section of your HTML file:
<script type="text/javascript" src="NivooSlider.js"></script> <link href="NivooSlider.css" rel="stylesheet" type="text/css" media="screen" />
And the gallery structure:
<div id="Slider" class="nivoo-slider"> <a href="#"> <img src="images/1269388.jpg" alt="" title="This is an example of a linked image" height="350" width="600" /> </a> <img src="images/1268244.jpg" alt="" title="This is an example of a caption" height="350" width="600" /> <a href="#"> <img src="images/1270048.jpg" alt="" title="This is another example of a caption" height="350" width="600" /> </a> <img src="images/1270256.jpg" alt="" title="This is another example of a caption" height="350" width="600" /> </div>
And then initialize the slider using the domready event:
window.addEvent('domready', function () { // The simple way new NivooSlider($('Slider')); // The more advanced way new NivooSlider($('Slider'), { animSpeed: 750, effect: 'sliceLeftRightDown', interval: 5000, orientation: 'horizontal', slices: 20 }).addEvents({ 'onFinish': function () { // fired after each transition }, 'onLastSlide': function () { // fired when the last slide comes on }, 'onStart': function () { // fired right before each transition } }); // add an if statement to check for the slider element (e.g. in a global script) // in this way you can add the code even if the slider element doesn't exist on the current page if ($('Slider')) { new NivooSlider($('Slider')); } }
var slider = new NivooSlider(element[, options]);
MIT-style license.
A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.
Found a bug in this plugin? Please report it this repository's Github Issues.
blog comments powered by Disqus