three.js输入类型=“文本”不起作用

时间:2013-11-20 09:53:58

标签: javascript html css input three.js

我是新手three.js,我需要帮助 我的页面有导航栏和threejs conteiner

#navcontainer 
{
position:fixed;
display: block;
background-color: #303b47;
z-index:100; 
position:absolute;
}

navbar有一个搜索输入表单:

<input id="searchbt" type="text" placeholder="Search" >

风格:

#searchbt{    
    background:  #29333d url(../img/Search.png) left no-repeat;
    padding-left: 20px;
    border-radius: 0px;
    border-style:none; 
    width:200px;
    height:66px; 
    color:#fff;
}

threejs conteiner:

if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
            //var container, stats;
            var camera, controls, scene, renderer, projector;
            var cross;      
            var posN = 80; 

            init();
            animate();

            function init() {       
                var container = document.getElementById("threejs");//ищем элемент co        

                camera = new THREE.PerspectiveCamera( 90,container.clientWidth / container.clientHeight, 0.1, 2000 );
                camera.position.z = posN;

                controls = new THREE.OrbitControls (camera );
                controls.addEventListener( 'change', render );

                scene = new THREE.Scene();

                var manager = new THREE.LoadingManager();

                manager.onProgress = function ( item, loaded, total ) {
                    console.log( item, loaded, total );
                };

                var texture = new THREE.Texture();
                var loader = new THREE.ImageLoader( manager );
                loader.load( './kos.jpg', function ( image ) {
                    texture.image = image;
                    texture.needsUpdate = true;
                } );

                // model
                var loader = new THREE.OBJLoader( manager );
                loader.load( './skull.obj', function ( object ) {
                    object.traverse( function ( child ) {
                        if ( child instanceof THREE.Mesh ) {
                            child.material.map = texture;
                        }
                    } );
                    object.position.y = 10;
                    scene.add( object );
                } );

                //

                light = new THREE.DirectionalLight( 0xffffff );
                light.position.set( 1, 1, 1 );
                scene.add( light );

                light = new THREE.AmbientLight( 0xffffff );
                scene.add( light );

                   // Picking stuff
                  // projector = new THREE.Projector();
                renderer = new THREE.WebGLRenderer( { antialias: false } );

                 renderer.setSize(container.clientWidth , container.clientHeight);
                container.appendChild(renderer.domElement);

                window.addEventListener( 'resize', onWindowResize, false );
            }

            function onWindowResize() {
                camera.aspect = container.clientWidth / container.clientHeight;
                camera.updateProjectionMatrix();
                renderer.setSize( container.clientWidth , container.clientHeight );
                render();

            }

            function animate() {
                requestAnimationFrame( animate );
                controls.update();
            }

            function render() { 
                camera.updateMatrixWorld();
                renderer.render( scene, camera );
            }

包括如何

    <div id="threejs" style=""> 
<script type="text/javascript" src="js/model.js">

式:

#threejs{
    width:100%; 
    height:500px; 
    top:100px; 
    position: absolute; 
    z-index: 25px;
}

在搜索栏上找到鼠标时,它突出但不起作用(不输入信息) Mby任何人都知道......这是怎么回事?

0 个答案:

没有答案