1

このコードは frm01 の可視性を切り替えます

$(document).ready(function () {
    $("#reg").click(function () {
        if ($("#frm01").is(":visible")) $("#frm01").hide("slide", {
            direction: "down"
        }, 1000);
        else $("#frm01").show("slide", {
            direction: "down"
        }, 1000);
    });
});

ただし、下にある div (div bellow frm01) は、スライド効果なしで、一時的に上下に移動します。
スライド効果も使って動かしたいです。

4

1 に答える 1

1

それが別の div である場合、その div を jquery セレクターにも単純に追加してみませんか?

$(document).ready(function() {
    $("#reg").click(function () {
        if ($("#frm01").is(":visible"))
            $("#frm01,#otherdiv").hide("slide", { direction: "down" }, 1000);
        else
            $("#frm01,#otherdiv").show("slide", { direction: "down" }, 1000);
    });
});

または、div の動きをアニメーション化するだけの場合は、jquery .animate() 関数を使用します。

$(document).ready(function() {
    $("#reg").click(function () {
        if ($("#frm01").is(":visible")) {
            $("#frm01").hide("slide", { direction: "down" }, 1000);
            $("#otherdiv").animate({margin-top: "50px"}, 1000);
        } else {
            $("#frm01").show("slide", { direction: "down" }, 1000);
            $("#otherdiv").animate({margin-top: "100px"}, 1000);
        }
    });
});

CSS 変更のアニメーション化の詳細はこちら

于 2012-07-16T07:41:21.410 に答える