0

#text-slidein div スライドを非表示の状態からスライドさせようとしています。すべてのバリエーションを試したに違いありませんが、動作させることができませんでした。

 $(document).ready(function() {
    $("#top-2").animate({
        "top": "0px"
    }, 1500, 'easeOutExpo');
    $("#btm-2").animate({
        "top": "0px"
    }, 1500, 'easeOutExpo', function() {
        $("#top-1").animate({
            "top": "0px"
        }, 1500, 'easeOutExpo');
        $("#btm-1").animate({
            "top": "0px"
        }, 1500, 'easeOutExpo', function() {
            $("#top-3").animate({
                "top": "0px"
            }, 1500, 'easeOutExpo');
            $("#btm-3").animate({
                "top": "0px"
            }, 1500, 'easeOutExpo', function() {
                $("#row-top").animate({
                    "top": "-25"
                }, 1000, 'easeOutExpo');
                $("#row-btm").animate({
                    "top": "25px"
                }, 1000, 'easeOutExpo');
                $("#text-slidein").animate({
                    width: 'toggle'
                }, 350, 1000, function() {
                    $(".fade").fadeOut(1000, function() {
                        $("#menu-nav").fadeIn(1000);
                        $("#news-box").fadeIn(1000);
                    });
                });
            });
        });
    });
});

スライダーが機能するのに最も近いのは、次のスライド機能を使用したときでした。

$("#text-slidein").show('slide', {direction: 'right'}, 2000, function(){

何らかの理由で、このコードを使用すると、スライダーが一度動作し、その後スライダーが表示されず、スライドインに使用される空白のスペースしか表示されません.

$("#text-slidein").show('slide', {direction: 'right'}, 2000, function(){

jsfiddleにサンプルがあります

助けていただければ幸いです。ありがとう

4

2 に答える 2

0

質問に投稿したコードは、jsfiddleに投稿したコードとは異なります。jsfiddleのコードに関しては、問題は、呼び出していることです。

                $("#text-slidein").show('slide', {
                    direction: 'right'
                }, 2000, function() {
                    $(".fade").fadeOut(1000, function() {
                        $("#menu-nav").fadeIn(1000);
                        $("#news-box").fadeIn(1000);
                    });
                });

そのshowのシグネチャはjQueryUI固有ですが、jQueryUIは参照されません。jQueryUIをチェックしたところ、動作しているようです。

于 2012-07-31T19:08:08.433 に答える
0

デモ

コードにいくつかの変更を加えました。

CSS:

#text-slidein {
    top: 260px;
    font-family: Arial, Helvetica, sans-serif;
    color: #888;
    font-size: 17px;
    padding: 15px 0;
    width: 0px;
    height:8px;
    position: absolute;
    overflow:hidden;
    margin-left:-800px
}

jQuery:

        $("#text-slidein")
            .animate({
                width:800,
                marginLeft:0
          }, 2000, function() {
              $(".fade").fadeOut(1000, function() {
                  $("#menu-nav").fadeIn(1000);
                  $("#news-box").fadeIn(1000);
              });
          });
于 2012-07-31T19:09:05.077 に答える