#9. Previous Slide 2 Interactive Website Flipboard Help?


#1

Can anyone help me debug my code? cant figure out what is wrong. any input is appreciated. thanks
my error code is remember to fade out the current slide & and remove the active slide class.
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(600).removeClass('active-slide');
prevSlide.fadeIn(600).addClass('active-slide');

}
}

$(document).ready(main)


#2

Hi Clee820,

You've got two problems in your code :)

  1. Line 15, remove the dot (.) between $ and ( so it looks like this: $('
  2. Line 37, you need a closing parenthesis ()) after the closing curly brace (})

Good luck with the rest of the course!
Please let me know if you have any more questions or it's still not working properly :)


#3

thank you for your help. i didnt even notice the extra dot on line 15. the code still is coming up wrong.. underneath where it shows the flipboard website, it is saying uncaught syntax error, missing ) after argument list. and when i try to run the code, this error message comes up- remember to fade out the current slide & remove the 'active-slide' class.
heres my code, thanks again for your help!!

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(600).removeClass('active-slide');
prevSlide.fadeIn(600).addClass('active-slide');

}
});
$(document).ready(main)


#4

not sure if this will fix everything BUT you need a semicolon at the end of $(document).ready(main) <----right there needs ;


#5

@clee820 You need to move the closing parenthesis ())on line 38 to after the closing curly brace (}) on line 37, so it looks like this:

37   });
38 };

@xaosqueen Sorry, but adding a semi-colon there isn't going to fix anything :)


#6

I didn't think it would fix his problem @zystvan, but I do know its good syntax, and I hadn't had my coffee yet! :smile: