Skip to content

axeff/ugla-slider

Repository files navigation

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

About

javascript slider

Resources

Stars

Watchers

Forks

Packages

No packages published