$('document').ready(function () {
console.log("template js is working fine ");
//basic slider starts
var triggers = $('ul.triggers li');
var images = $('ul.images li');
var lastElem = triggers.length - 1;
var target;
triggers.first().addClass('active');
images.hide().first().show();
function sliderResponse(target) {
images.fadeOut(400).eq(target).fadeIn(400);
triggers.removeClass('active').eq(target).addClass('active');
}
triggers.click(function () {
if (!$(this).hasClass('active')) {
target = $(this).index();
sliderResponse(target);
resetTiming();
}
});
$('.next').click(function () {
target = $('ul.triggers li.active').index();
target === lastElem ? target = 0 : target = target + 1;
sliderResponse(target);
resetTiming();
});
$('.prev').click(function () {
target = $('ul.triggers li.active').index();
lastElem = triggers.length - 1;
target === 0 ? target = lastElem : target = target - 1;
sliderResponse(target);
resetTiming();
});
function sliderTiming() {
target = $('ul.triggers li.active').index();
target === lastElem ? target = 0 : target = target + 1;
sliderResponse(target);
}
var timingRun = setInterval(function () { sliderTiming(); }, 5000);
function resetTiming() {
clearInterval(timingRun);
timingRun = setInterval(function () { sliderTiming(); }, 5000);
}
//basic slider ends
});
Thursday, April 9, 2015
Simple slider
Subscribe to:
Post Comments (Atom)
Hi Shaji, would be even better if you add fiddle to it.
ReplyDeleteOk Sure i will do it
Delete