0

divドキュメント内の異なるものを切り替えようとしていHTMLます。これは私のコードです:

    <div id="screen1" class="current">
            <div id="press_any_key_to_continue"> <font style="font-family: verdana" color="yellow">Press Enter to start</font></p> </div>


    <script>
    var container;
    var camera, scene, renderer;

    init();
    animate();
    //And a lot of THREE.js code..

    </script>

    </div>
<div id='screen2'>
<p>Some content goes here</p>
</div>

私のjQueryメソッドは、次のように、divwhich idisをフェードアウトし、 idを使用screen1して別のフェードインします。divscreen2

$(document).keyup(keyUpHandler);

function keyUpHandler(e) {


    if (e.keyCode == 13) {

        var id = $('.current').attr('id');

        console.log('The id of the current div is: ' + id);
        if (id == 'screen1') {


            toggleDivs('screen2');
        }
    }

}


function toggleDivs(id) {

    console.log('Hello world, the id passed is: ' + id);

    $('.current').fadeOut(600, function () {
        $('#' + id).fadeIn(600);
        $('.current').removeClass('current');
        $('#' + id).addClass('current')
    });
}

これまでのところ、screen2 は素敵なフェードイン効果で表示されますが、screen1 はフェードアウトしません。たとえば、screen1 の html 部分は正常にフェードアウトしますが、javascript 部分はフェードアウトしません。

したがって、フェードアウトはJSスクリプトを停止しないと思います。そうでなければ、どうすればこれを解決できますか。ありがとう。

4

3 に答える 3

0

ここで、コードを修正しました：http: //jsfiddle.net/RASG/AK9kZ/

を押すたびenterに、が切り替わりますdiv。

これを達成するためのより良い方法があることに注意してください。

コードを再利用しました。

ええと ドイス

于 2012-09-18T17:33:12.103 に答える
0

アニメーションを停止するには、使用したいのです.stopが、コードではこれが問題になることは明らかではありません。

于 2012-09-18T17:20:45.970 に答える
0

animate() 関数は「バックグラウンド プロセス」のようなものを開始し、その後、関数の残りの部分が続行されます。これは単に Javascript の動作の効果です。現在のウィンドウ内のすべてanimate()が Javascript の実行中にフリーズするため [1]、数ミリ秒ごとに次の必要なアニメーションを実行するタイマーを設定します。

使用しているライブラリはわかりませんが、 a への参照がある場合callback、それは「アニメーションが終了したときにどの関数を呼び出せばよいか?」ということです。

[1] そう、そう、Opera、そう、それは例外

于 2012-09-18T17:24:57.693 に答える