I have a slide show with two slides. Each slide is held for 5-6 seconds before changing, but when I use the previous buttons, this does not work. One way or another, it saves the original timer (from the self-timer), so when I select "next", for example, 1 second before the transition, the next slide will remain for one second. Therefore, when I select the following, it does not reset the timer and instead saves the original timer.
So, in conclusion, I want to reset the timer in the previous next functions (or if you have any other ideas that will be appreciated).
This is JS:
"use strict";
var currentSlide = 1;
var transition = 1000;
var slideLength = 2;
var slideInter = 6000;
$(".slider ul li:nth-child(" + currentSlide + ")").fadeIn(transition);
$(".next").click(function () {
nextSlide();
});
$(".prev").click(function () {
prevSlide();
});
function nextSlide() {
$(".slider ul li:nth-child(" + currentSlide + ")").fadeOut(transition);
currentSlide++;
if (currentSlide > slideLength)
currentSlide = 1;
$(".slider ul li:nth-child(" + currentSlide + ")").fadeIn(transition);
}
function prevSlide() {
$(".slider ul li:nth-child(" + currentSlide + ")").fadeOut(transition);
currentSlide--;
if (currentSlide < 1)
currentSlide = 2;
$(".slider ul li:nth-child(" + currentSlide + ")").fadeIn(transition);
}
var timer = setInterval(nextSlide, slideInter);
function resett() {
clearInterval(timer);}
function timing () {
timer = setInterval(nextSlide, slideInter);}
$(".slider").hover(resett,timing);
Let me know if you need more information or if you do not understand something from what I said.
source