0

2 つの HTML ドキュメント間でフェードを作成できるかどうかを知りたいです。私はいくつかの HTML ページを持っていますが、そのうちの 2 つを使って例を作りましょう。

index.html, jobs.html

どちらにも、<a>ボタン付きのメニューがあります。私がやりたいことは次のとおりです。

をクリックする<a href="jobs.html" id="jobs">Jobs</a>とindex.html（現在オンになっている）フェードアウトしてフェードインします。HTMLドキュメント全体でjobs.htmlフェードアウトするようなものです。div

どんな助けでも大歓迎です。

4

4 に答える 4

4
  1. css を使用して本文を非表示にします。
  2. フェードイン・イン・ザ・ボディ
  3. ボタンをクリックしてその ID を取得する
  4. ボディをフェードアウト
  5. 新しい URL に移動します
<!DOCTYPE html>
<html>
<head>
    <style>
        body{
            display: none;
        }
        .myBtn{
            cursor: pointer;
        }
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

    <script>
        $(function(){
            $('body').fadeIn();
            $('.myBtn').click(function(){
                url = $(this).attr('id') + '.html';
                $('body').fadeOut(function(){
                    window.location = url;
                });     
            });
        });
    </script>
</head>
<body>
    <h1>index.html</h1>
    <div class="myBtn" id="index">index</div>
    <div class="myBtn" id="jobs">jobs</div>
</body>
</html>

http://jsfiddle.net/Dp4Hy/

PS。新しいページに移動しようとしているため、明らかにフィドルは機能しませんが、最初はフェードインし、ボタンをクリックするとフェードアウトします。使用するすべてのページにこのスクリプトが含まれている必要があります。

于 2013-08-02T14:25:41.737 に答える
0

はい、可能です。html を DIV に追加するか (ご存知のように)、iframe を使用して、iframe タグのフェードを管理できます。

于 2013-08-02T14:23:07.120 に答える