jquery - marginleftjqueryに制限を設ける方法

Question

このスライダーをどのように制限しますか。

左矢印をmargin-left：0に制限したい; そして、マージンへの右矢印：-左：-500px;

これを行うのは難しいでしょうか？

助けていただければ幸いです。

jsfiddle： http: //jsfiddle.net/utKqe/2/

//other category page, navigate through cats
    $(document).ready(function() {

        $('#otherleftarrow').click(function() {
            $('#othermenu ul').animate({marginLeft: '-=100px'}, 200);
            return false; // prevent default click action from happening!
        });

        $('#otherrighttarrow').click(function() {
            $('#othermenu ul').animate({marginLeft: '+=100px'}, 200);
            return false;
        });

    });

Answer 1

次のようなものを試してください。

$(document).ready(function() {

    $('#otherleftarrow').click(function() {
        if ( parseInt($('#othermenu ul').css('margin-left')) > -500 )
            $('#othermenu ul').animate({'margin-left': '-=100'}, 200);
        return false; // prevent default click action from happening!
    });

    $('#otherrighttarrow').click(function() {
        if ( parseInt($('#othermenu ul').css('margin-left')) < 0 )
            $('#othermenu ul').animate({'margin-left': '+=100'}, 200);
        return false;
    });

});

Answer 2

$(document).ready(function() {

    $('#otherleftarrow').click(function() {
        $('#othermenu ul').animate({'margin-left': '-=100'}, 200);
        return false; // prevent default click action from happening!
    });

    $('#otherrighttarrow').click(function() {
        $('#othermenu ul').animate({'margin-left' : '+=100'}, 200);
        return false;
    });

});

変更点：animate（{marginLeft：'-= 100px'}）の代わりにanimate（{margin-left：'-= 100'}）

編集：申し訳ありませんが、@ YMMDを指摘していただき、ありがとうございます。