Alright, I give up


#1



https://www.codecademy.com/en/courses/web-beginner-en-seyrq/0/11?content_from=make-an-interactive-website%3Ajquery-effects


I'm pretty sure I did something small and silly. It's with great humility I show this code to you in frustration.


var main=function(){
    $('.dropdown-toggle').click(function(){
        $('.dropdown-menu').toggle()}
    );
    $('.arrow-next').click(function(){
        var currentSlide=$('.active-slide');
        var nextSlide= currentSlide.next();
        
         if(nextSlide.length==0){nextSlide=$('.slide').first();
        };
        
        currentSlide.fadeOut(600).removeClass('active-slide');
        nextSlide.fadeIn(600).addClass('active-slide');
        
        var currentDot=$('.active-dot');
        var nextDot=currentDot.next();
        
        if (nextDot.length==0){nextDot=$('.dot').first();};
        
        currentDot.removeClass('active-dot');
        nextDot.addClass('active-dot');
        });
        
    $('.arrow-prev').click(function(){
       var currentSlide= $('.active-slide');
       var prevSlide= currentSlide.prev();
       
        var currentDot = $('.active-dot');
        var prevDot = currentDot.prev();
       
      
       if (prevSlide.length==0){
           prevSlide=$('.slide').last();
           };
           

           
        currentSlide.fadeOut(600).removeClass('active-slide');
        prevSlide.fadeIn(600).addClass('active-slide');
       
       if(prevSlide.length == 0) {
         prevDot = $('.dot').last();}
         
       currentDot.removeClass('active-dot');
       prevDot.addClass('active-dot');
    
    });
};

$(document).ready(main);


#2

HI inside your $('.arrow-next').click(function() { ... }); you have two if statement

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

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

put it like that

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

DO the same for the if statements inside the $('.arrow-prev').click(function(){ .. });


#3

That should not matter. Did you test his code, or just toss out this answer?


#4

What @wizmarco suggests will solve the problem, but it doesn't point out where the issue is.

Consider that an earlier statement already changed the prevSlide, so its state is not what it was, To work around this, use prevDot.length

    if (prevDot.length == 0) {
        prevDot = $('.dot').last();
    }