Question

I’m developing a carousel style slider and want to hide one of the controls once the left margin of the ul equals -3480px. Here’s my code:

$(function(){
    if($("ul#listName").css("margin-left") == "-3480px"){
      $(".nextButton").hide();
    }    
});

It’s not doing anything though and I’m not sure what to do next. Has anyone got any pointers or suggestions?

Answer 1

Based on what style property you are animating you should check that. Also make sure that convert the value into int before comparing because css() method will give the unit(px/em..) also along with its value.

    if(parseInt($("ul#listName").css("margin-left"), 10) == -3480){
        $(".nextButton").hide();
    }    

If you are executing this code on any animation callback then I would suggest you to check for <= instead of == because the value may not be that perfect during animation. Try this.

    if(parseInt($("ul#listName").css("margin-left"), 10) <= -3480){
        $(".nextButton").hide();
    }