0

私はスライダーを作成していて、ボタンを具体的にどのようにプログラムするかを理解しようとしています。

クリック時に700ピクセル単位で左に移動したいのですが、marginLeftが2800ピクセルを超えると、クリックしても何も実行されません。

現在、コンテナを段階的に移動する部分がありますが、「slider_container」のmarginLeftが2800 pxを超えた後、何も実行されない部分を作成する方法がわかりません。

$("#left").click(function () {
    $("#slider_container").animate ({
        marginLeft: "+=700px"
    },450 );
});

なぜ以下が機能しないのか疑問に思いました：

if ($("#slider_container").css("marginLeft") >= 2800) {
      $("#right").click(function () {
    $("#slider_container").animate ({
        marginLeft: "-=0px"
    },450 );
});  
}
else
{
    $("#right").click(function () {
    $("#slider_container").animate ({
        marginLeft: "-=700px"
    },450 );
});  

}
4

2 に答える 2

1

これを試して：

$("#left").click(function () {
    var margin = parseInt($("#slider_container").css("marginLeft")),
        move = Math.min(700, 2800 - margin);
    if (move > 0) {
        $("#slider_container").animate ({
            marginLeft: "+=" + move + "px"
        },450 );
    }
});

質問に追加したコードでは、クリックイベントのif内部を配置する必要があります。functionまたanimate to "-=0px"、、それは意味がありますか？

于 2012-11-23T13:29:25.827 に答える
0

了解しました。動作しました。思いついた解決策は次のとおりです。

$("#right").click(function () {


if (parseInt($("#slider_container").css("marginLeft")) < -2100) {
    $("#slider_container").animate ({
        marginLeft: -2800
    },450 ); 
}
else
{
    $("#slider_container").animate ({
        marginLeft: "-=700px"
    },450 ); 

}
});

$("#left").click(function () {


if (parseInt($("#slider_container").css("marginLeft")) > -699) {
    $("#slider_container").animate ({
        marginLeft: 0
    },450 ); 
}
else
{
    $("#slider_container").animate ({
        marginLeft: "+=700px"
    },450 ); 

}
});
于 2012-11-23T15:02:06.427 に答える