2

私はjquerymobileとthree.jsをいじっています。

これが私のコードです

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

        <title>Hello World</title>
    </head>
    <body>
    <script src="js/jquery-1.8.3.min.js"></script>
    <script src="js/jquery.mobile-1.2.0.js"></script>   
    <script src="js/three.min.js"></script>

    <script>

    var camera, scene, renderer;
    var geometry, material, mesh;

    init();
    animate();

    function init() {

        camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
        camera.position.z = 1000;

        scene = new THREE.Scene();

        geometry = new THREE.CubeGeometry( 200, 200, 200 );
        material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );

        mesh = new THREE.Mesh( geometry, material );
        scene.add( mesh );

        renderer = new THREE.CanvasRenderer();
        renderer.setSize( window.innerWidth, window.innerHeight );

        document.body.appendChild( renderer.domElement );
        $(document).live("vclick", function (evt) {
            alert('list click');
        }); 
    }

    function animate() {

        // note: three.js includes requestAnimationFrame shim
        requestAnimationFrame( animate );


        mesh.rotation.x += 0.01;
        mesh.rotation.y += 0.02;

        renderer.render( scene, camera );

    }

    </script>   
    </body>
</html>

これはthree.jsの例であり、正常に機能します。jquery mobileとjqueryライブラリを含めると、ドキュメントが2回読み込まれます。（長方形があります。下にスクロールすると、回転する立方体があり、下部に「読み込み中」というテキストが2回表示されます。）

誰かが何が起こっているのか説明できますか？2つのjqueryライブラリのみを含めました。

4

1 に答える 1

0

これは jquery モバイルの癖です。スクリプトをheadではなくに移動してみてくださいbody。それでも問題が解決しない場合は、three.js コードを jqm の pageinit 内に移動します。

$(document).bind('pageinit', function() {
     // your code here...
})
于 2013-03-24T23:28:06.147 に答える