0

jquery を使用して index.html ファイルに Web サイトのイントロを作成しました。いくつかの.jpg画像を連続して「フェードイン」および「フェードアウト」します。したがって、これが終了した後、「ホームページ」となるhtmlファイルをロードすると、ブラウザのURLが「www.blabla.com」から「www.blabla.com/home.html」に変更され、ユーザーがブラウザを更新すると、イントロは再び再生されず、「www.blabla.com/home.html」が表示されるだけです。以下のコードを使用して、イントロが終了した後に home.html を読み込みますが、ページの最後に最初から表示されているようで、ページを更新すると、ページのイントロが再び再生されます。

        <script type="text/javascript">
    $(function() { 
                    $( document ).ready(function() {
            $("#image1").delay(0000).fadeIn("slow").delay(3000).fadeOut("slow");    
        });
                    $( document ).ready(function() {
            $("#image2").delay(3000).fadeIn("slow").delay(3000).fadeOut("slow");    
        });
        $( document ).ready(function() {
            $("#image3").delay(6000).fadeIn("slow").delay(3000).fadeOut("slow");    
        });
         $( document ).ready(function() {
            $("#home").delay(10000).fadeIn("slow").load('home.html');       
        });
      });


 <div id="intro>
        <div id="image1"></div>
        <div id="image2"></div>
        <div id="image3"></div>  
     </div>
     <div id=main></div>

どうすればこれを変更できますか?

4

1 に答える 1

2

最終的なフェードアウトにコールバック関数を追加し、プレーンな Javascript を使用してブラウザーを home.html にリダイレクトするだけです。そのページが実際に存在することを確認してください。

また、ドキュメントの準備ができているすべてのビットが内部で必要ないため、コードを合理化しました$(function(){ ... });

$(function() {
        $("#image1").delay(0000).fadeIn("slow").delay(3000).fadeOut("slow");
        $("#image2").delay(3000).fadeIn("slow").delay(3000).fadeOut("slow");
        $("#image3").delay(6000).fadeIn("slow").delay(3000).fadeOut("slow", function() {
             window.location.href = "home.html";
        });    
    });
  });

ご不明な点がございましたら、お知らせください。

于 2013-11-10T20:47:27.543 に答える