1

私は2つの画像をスライドさせて、画像がなくなった後にmycontent divをフェードインさせたいと思っています。アニメーションは機能し、遅延部分だけでなく呼び出されています:(

これが機能しない理由はありますか？

function mepage(){
var ele = document.getElementById("btn2");
var ele = document.getElementById("btn3");
var mycont = document.getElementById("mycontent");
if(ele.style.display == "inline-block") {
    $("#btn2").slideUp(1000);
    $("#btn3").slideUp(1000);
    $("#mecontent").delay(1000).css("visibility","visible").fadeIn(400);

}
else {
    $("#btn2").slideDown(1000);
    $("#btn3").slideDown(1000);
    $("#mecontent").css("visibility","hidden");
    ele.style.display = "inline-block";
}

}

ありがとう ：）

4

2 に答える 2

3

jQuery によってキューに入れられる関数はほとんどcssなく、その中には含まれていません。

あなたはそれを行うことができます：

$("#btn2").slideUp(1000);
$("#btn3").slideUp(1000, function() {
    $("#mecontent").css("visibility","visible").fadeIn(400);
});

または、なぜフェードインの前に可視性を変更したのかわかりません:

$("#btn2").slideUp(1000);
$("#btn3").slideUp(1000, function() {
    $("#mecontent").fadeIn(400);
});
于 2012-10-13T20:20:05.963 に答える
3

関数はアニメーション キューに入れられないため、.cssすぐに実行されます。キューに入れることができるプラグインについては、この回答を参照してください。

とは言っても、「補完」関数を使用し、要素の可視性を変更するために.show()およびを使用する方が良いでしょう:.hide()

if ($(ele).is(':visible')) {
    $("#btn2,#btn3").slideUp(1000, function() {
        $("#mecontent").delay(1000).fadeIn(400);
    });
} else {
    $("#btn2,#btn3").slideDown(1000, function() {
        $("#mecontent").hide();
    });
}
于 2012-10-13T20:20:51.497 に答える