- Web templates
- E-commerce Templates
- CMS & Blog Templates
- Facebook Templates
- Website Builders
Looped Slider
November 15, 2010
This is a Slider Script that could be used both for creating sliders and galleries. It is one of the most flexible slider scripts.
http://github.com/nathansearles/loopedSlider
JavaScript
In order to make the script work, the index-#.html file with a slider should contain these lines of HTML code in order to include loopedslider.js script and jQuery framework:
The section of the index-#.html file contains these lines of code that initialize the script functionality with basic values:
This script is initialized with a HTML The whole slider is placed to a Bulleted list ( CSS Make sure to set the same width value for .container and .slides div styles. element with #loopedSlider id.
Below you can see the HTML script representation: tag with #loopedSlider id. Then there two container
tags: main container (.container class) and pagination container (.pagination-container class). A
tag with .slides class is placed into the main container and contains slider (or gallery) elements. So in order to add an extra slide (or gallery image) you will need to add the following coding structure:
tag) with the .pagination class defines pagination output for the slider (or a gallery).
For loopedSlider version 0.5.4 and lower you have to add correspondent number of anchors ( tags), each slider should have a correspondent anchor.
For loopedSlider version 0.5.5 and newer the plug-in will add necessary scripting automatically.
You can find script related stylesheet in the main style.css file. You will need to modify the following styles: