CODEWITHSUNDEEP
javascripthtmljquerycss
Darksymphony
Darksymphony

Reputation: 2713

How to revert css properties in jQuery

In my jQuery function, I am animating a div element, so it moves 200px to right, receives a Moved class and some opacity:

if (!$(".block2").hasClass("Moved2")) {
    $(".block2").animate({
        "left": "+220px"
    }, "slow", function() {
        $.ajax
        ({url: 'play.php',
            data: {"var1": val},
            type: 'get',
            success: function(json) {
                if(!json.error) {$(".block2").removeClass("Moved2").css({left:"0",opacity:"1"});}
        }});
    } ).fadeTo("slow", 0.33).addClass("Moved2");
}

This works fine, but after it finishes, I want to have all properties and css back as they were before animation. But I don't want to reload the page.

As you can see, now I do it this way:

$(".block2").removeClass("Moved2").css({left:"0",opacity:"1"});

It does what I want, but there might be more properties affected in another functions and I don't want to change each element one by one. Is there a kind of UNDO for everything done by that jQuery sequence?

Upvotes: 0

Views: 162

Answers (1)

dippas
dippas

Reputation: 60603

You can use removeAttr(), in this way, it will remove all inline styles added to class .block2

$(".block2").removeClass("Moved2").removeAttr("style")

Upvotes: 1

Related Questions