javascript slider
JavaScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
MIT-LICENSE.txt
README.markdown
basic-example.html
ugla-slider.jquery.json
ugla-slider.js

README.markdown

UGLA-Slider

[...] it slides back to the beginning, after reaching the end [...]

Tested on

  • Chrome (Mac)
  • Firefox (Mac)
  • Safari (Mac)

**DEMO**

DEMO 1 (mobile touch develop branch)
DEMO 2
DEMO 3

Usage: You need a wrapper (in this example called ".slider") and put your contents each in a "container" within that wrapper

<div class="slider">
	<div class="container">
	   Content Page 1
	</div>
	<div class="container">
		Content Page 2
	</div>
	<div class="container">
		Content Page 3
	</div>
	<div class="container">
		Content Page 4
	</div>
</div>

Call uglaSlide() on the wrapper ".slider"

$(document).ready(function(){
	$(".slider").uglaSlide();
});

It will by default prepend a "<<" and ">>" link-set. If you want to place your own links, feel free to do so, just tell the plugin where to find them. Also the speed for the animations can be optionally adjusted (standard is 0.5s)

$(".slider").uglaSlide({
   	left: $(".slider.left"),
	right: $(".slider.right"),
	speed: "0.5s",
});

Contents:

  • ugla-slider.js
  • index.html