9. Previous Slide 2

jquery

#1

This is my code, I have followed the instruction and hints, still does not work, please help @zystvan

var main = function() {
    
 $('.dropdown-toggle').click(function() {
    $('.dropdown-menu').toggle();
  });

$('.arrow-next').click(function() {
    var currentSlide = $('.active-slide');
    var nextSlide = currentSlide.next();

    var currentDot = $('.active-dot');
    var nextDot = currentDot.next();


    if(nextSlide.length == 0) {
    nextSlide = $('.slide').first();
  nextDot = $('.dot').first();
  }

    currentSlide.fadeOut(600).removeClass('active-slide');
    nextSlide.fadeIn(600).addClass('active-slide');
  
  currentDot.removeClass('active-dot');
  nextDot.addClass('active-dot');
  
});
});

$('.arrow-prev').click(function() {
  var currentSlide = $('.active-slide');
  var prevSlide = currentSlide.prev();

  if(prevSlide.length == 0) {
    prevSlide = $('.slide').last();
  }

  currentSlide.fadeOut(duration).removeClass('active-slide');
  prevSlide.fadeIn(duration).addClass('active-slide');
});
}

$(document).ready(main);

Instructions:
Inside the click event handler for '.arrow-prev', write an if statement to handle this case:

After creating the variables currentSlide and prevSlide, write an if statement that checks if prevSlide.length == 0.

If it is, set prevSlide equal to the last slide using $('.slide').last();

Hint:
The event handler now looks like this:

$('.arrow-prev').click(function() {
  var currentSlide = $('.active-slide');
  var prevSlide = currentSlide.prev();

  if(prevSlide.length == 0) {
    prevSlide = $('.slide').last();
  }

  currentSlide.fadeOut(duration).removeClass('active-slide');
  prevSlide.fadeIn(duration).addClass('active-slide');
});

Thanks in advance :smile:


#2

Hey Mehreen95,

I formatted your post to make the code one big code block, instead of a bunch of fragmented code bits, but thanks for formatting it :)

Closing your $('.arrow-next').click(...);, you've got this:

It doesn't matter which one, but one of those needs to be removed and then I think your code will work :)