jquery - IF works, ELSE doesn't work

Question

This is my code. It works on first click but not on second.. More precisely, IF works, ELSE doesn't work.

$(document).ready(function(){
    $( ".one" ).click(function() {     
        if($('.two').css('margin-right','-345px'))
            $('.two').css('margin-right', '0');
        else
            $('.two').css('margin-right', '-345px');       
    });
});

What am I doing wrong?

You want to compare the css property with that value (-345px), but this is the syntax to set the css property. — grdevphl, Jun 11 '15 at 17:52

score 0 · Accepted Answer · answered Jun 11 '15 at 17:49

0

$(document).ready(function(){
    $( ".one" ).click(function() {     
        if($('.two').css('margin-right') === '-345px')
            $('.two').css('margin-right', '0');
        else
            $('.two').css('margin-right', '-345px');       
    });
});

answered Jun 11 '15 at 17:49

Nikhil Aggarwal

28,197
4
43
59

What is the difference between === and == ? – hiru Jun 11 '15 at 17:52
== compares values whereas === compares value and type – Nikhil Aggarwal Jun 11 '15 at 17:54
@hiru [Take a look here](http://stackoverflow.com/questions/359494/does-it-matter-which-equals-operator-vs-i-use-in-javascript-comparisons) for an in depth explanation. – Ted Jun 11 '15 at 17:55
In this case there's no significant difference. Some programmers use `===` automatically. – Barmar Jun 11 '15 at 18:03

score 0 · Answer 2 · answered Jun 11 '15 at 17:50

0

Your condition is not correct.

It should be:

if($('.two').css('margin-right') == '-345px')
    ....

answered Jun 11 '15 at 17:50

codingrose

15,563
11
39
58

score 0 · Answer 3 · answered Jun 11 '15 at 17:52

0

Why not simplify things:

JS:

$(document).ready(function(){
    $( ".one" ).click(function() {     
        $('.two').toggleClass('mymargin');
    });
});

And CSS

.mymargin{
    margin-right:-345px;
}

answered Jun 11 '15 at 17:52

Ted

14,757
2
41
58

I didn't want to edit CSS so I decided to do everything in jQuery, but I'll probably use your method in the future. It is really simple – hiru Jun 11 '15 at 17:58

jquery - IF works, ELSE doesn't work

3 Answers3