bose.slider.js

Bose - jQuery DIV background Slider



Slider doesn't require any css. Controls in below is completely external and slider can suite into any container and image will auto fit! Good luck.



Feature

  1. div or element background slider
  2. can fit to any container whatever the image size is
  3. external controls
  4. play, pause, next, prev controls
  5. numeric pagination
  6. thumbnail pagination with text and description
  7. able to preload images into broswer cache
  8. callbacks
  9. need more? email to me@habibhadi.com


Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus, assumenda, iste, ducimus, animi nesciunt perferendis id deserunt recusandae sed voluptatem perspiciatis illo ratione quae sequi nostrum voluptates fugit fuga adipisci.







Usage: 



<script src="bose.slider.min.js">


$("selector").bose({
	images : [ "imagePath_1", "imagePath_2", "imagePath_3"]
});


External Controls



$('.play').click(function(){
	$(".bose").bose('play');
});

$('.pause').click(function(){
	$(".bose").bose('pause');
});

$('.previous').click(function(){
	$(".bose").bose('previous');
});

$('.next').click(function(){
	$(".bose").bose('next');
});


Options:



images       : [ "http://lorempixel.com/960/500/sports", "http://lorempixel.com/960/500/fashion", "http://lorempixel.com/960/500/nature"],
imageTitles  : [
	['Title 1', 'Description one here'],
	['Title 2', 'Description two here'],
	['Title 3', 'Description three here']
],
wrapClass    : '',
sliderClass  : '',
holderClass  : '',
startIndex   : 0,
transition   : 'fade',
timeout      : 5, // 5 sec
duration     : 2, // 2 sec
pagination   : { show : boolean(true/false), container : selector, text : boolean(true/false) },
thumbs       : { show : boolean(true/false), container : selector, dimension : { width : 100, height: 60 }, text : boolean(true/false) },
onComplete   : function() {},
onSlideStart : function() {},
onSlideEnd   : function() {},
onPause      : function() {},
autofit      : true // if false then background image will be cover


made by me@habibhadi.com