0

Ok, so i've got this code, it almost works i'm just stuck on the last bit!

$('.button').click(function() {
var id = this.id;
$('#slide'+id+'').each(function() {
    if ($(this).offset().left < 0) {

    } else {
        $('.current').animate({ left: '-200%', }, 1500 );
        $('.current').removeClass("current").addClass("previous");

        $(this).animate({ left: '-100%', }, 1500 );
        $(this).addClass("current");
        $('.previous').removeAttr('style');

    }
});
});

As you can see the current slide moves left, new slide moves in from right. Current is then reclassed previous, and then new slide is then classed current.

However the new previous slide still has in-line style left:-100% applied to it. I need to remove this style!??

Basically i need the slides to always go from right to left, even if it has been visited already! PLEASE SOMEONE HELP!!??

http://jsfiddle.net/ngpsk/

********SOLVED IT MYSELF*******

$('.button').click(function() {
var id = this.id;
$('#slide'+id+'').each(function() {
    if ($(this).offset().left < 0) {

    } else {
        $('.current').animate({ left: '-100%', }, 2000, function()
                {
                    $(this).removeAttr('style').removeClass("current");
                    $('#slide1').css("left", "100%");
                }
            );

        $(this).animate({ left: '0%', }, 2000 );
        $(this).addClass("current");
    }
});

});

SEEMS TO WORK AT LEAST!

user2195988
  • 19
  • 1
  • 9

1 Answers1

0

remove the class when the animation is complete, for an example see: jQuery event order and waiting till animation complete

Community
  • 1
  • 1
Michiel
  • 4,160
  • 3
  • 30
  • 42
  • can you elaborate? Perhaps modify the js fiddle link for me? Thanks in advance! – user2195988 May 23 '13 at 12:05
  • Please read the question again. He wants to remove the inline style left by .animate, not to remove some attribute after the animation is complete. – Pere Jul 02 '14 at 08:12