Three.jsが入力されていない入力タグ

現在、Three.jsのゲームに取り組んでいます。私は、ブラウザウィンドウ全体を占めるWeb GLレンダラを使用しています。今、私はチャットボックスを作りたいので、私はこのThree.jsが入力されていない入力タグ

<input id="chatMessageDiv" type="text" value="Message..."></input>

のような内部のinputタグを入れて、CSSのため

#chatMessageDiv { 
    position: absolute; 
}

私の問題は、私は変更に入力フォームをクリックすることはできませんですメッセージ。カーソルはテキストアイコンに変わりますが、何もクリックしても何も起こりません。

入力Z-インデックスを1に変更しようとしましたが、それも機能しませんでした。私は本当に軌道コントローラやトラックボールコントローラを追加したくありません。

出典

2016-12-09 wupto

本当に助けになるほどの情報を私たちに与えていない。 [これは]（http://stackoverflow.com/questions/22151271/placing-absolute-behind-relative-positioned-element）のようなシンプルなZ-インデックス/位置問題かもしれません – 2pha

問題がまだ解決されていないように見えます。入力フィールドが反応しない理由は、event.preventDefault()が存在しないためです。

出典

2016-12-10 16:07:28

ありがとう！あなたは正しかった、それは今働く。 – wupto

キャンバスを含むdivの前に入力#chatMessageDivを入れるだけで済みます。

<input id="chatMessageDiv" type="text" value="Message..."></input> 
<div> 
    <canvas width="1370" height="395" style="width: 1370px; height: 395px;"></canvas> 
</div>

これは、キャンバスの動作のためです。

注：要素divをid = infoで確認してください。

Demo webgl animation cloth

Code webgl animation cloth

出典

2016-12-09 20:20:34