1

jQuery UI (ソース: http://jqueryui.com/demos/tabs/ ) のタブを使用して、WebGL GLGE (ソース: http://www.glge.org/ ) を使用して COLLADA dae ファイルを各タブに表示したい)。タブは、xml ファイルに応じて動的に生成する必要があります。すべてが計画どおりに機能しますが、3D オブジェクトのレンダリングだけが機能しません。

私は今、さまざまなアプローチを試みましたが、どれもうまくいきません。結果は毎回同じです。3D COLLADA オブジェクトは、最初のタブでのみレンダリングされます。XML からデータを取得せずに基本的および静的な document.write ステートメントを使用しても、最初のページの建物のみが表示されます。

例えば:

<div id="tabs">
  <div id="tabs-1">
     //ONLY THIS OBJECT IS RENDERED
     <iframe src="glge/index_1.html" height="400" width="400"></iframe>
  </div>
  <div id="tabs-2">
     <iframe src="glge/index_1.html" height="400" width="400"></iframe>
  </div>
  <div id="tabs-3">
     <iframe src="glge/index_1.html" height="400" width="400"></iframe>
  </div>

jQuery タブから iframe を使用すると、複数の iframe がレンダリングされます。そう

<iframe src="glge/index_1.html" height="400" width="400"></iframe>
<iframe src="glge/index_1.html" height="400" width="400"></iframe>
<iframe src="glge/index_1.html" height="400" width="400"></iframe>
<div id="tabs">
     //codehere
</div>

タブの上に 3 つのレンダリングされた 3D オブジェクトを表示します。

私の問題を理解し、私を助けてくれることを願っています。

編集: 上記の「単純な」例をアップロードしました。以下で確認できます: http://korb.cwsurf.de/tmp/buildingdetail_simple.html

こんにちは、ファイコ

4

2 に答える 2

2

彼らが自分自身で何をすべきかを知る前に、<iframe>sが見える必要がある(または少なくとも非表示の親がいる)必要があるのでしょうか?表示されていないタブでの奇妙なサイズ設定と配置の問題を以前に見たことがあります。おそらく、同様の問題が発生しています。

タブを表示した<iframe>、 sを追加してみてください。このようなもの:

$('#tabs').tabs();
$('#tabs a:not(:first)').one('click', function() {
    var tab = this.href.replace(/.*#/, '#');
    setTimeout(function() {
        // Add the appropriate <iframe> here.
        $(tab).append('<iframe src="..."></iframe>');
    }, 0);
});

これは、最初のものがすでに開いていることを前提としています(したがって:not(:first))。oneクリックハンドラーをバインドするために使用すると、最初のアクティブ化後にハンドラーのバインドが解除されるため、 <iframe>sを不必要に再追加する必要はありません。「timeout0」トリックは、ブラウザが再び制御できるようになるまで何かを遅らせる方法であり、パネルが表示された後に追加する必要あります<iframe>

テクニックのクイックデモ:http://jsfiddle.net/ambiguous/FMBcE/

于 2012-01-13T01:48:14.530 に答える
2

iframe は最初は非表示の状態でロードされ、コードは基本的に非表示のものから 0x0 の寸法を取得します。タブのクリックで読み込むか、フレームを更新するかを選択できます。http://korb.cwsurf.de/tmp/buildingdetail_simple.html#tabs-2にアクセスすると、表示されているものだけが適切にレンダリングされていることがわかります。

JavaScript を使用してiframeをリロード/更新する最良の方法は何ですか? iframe をリロードする方法については、

空白の href から始めて、タブがクリックされたときにのみ入力することができます。または、すべてをレンダリングしてから、フレームの読み込み後にタブを呼び出します。

于 2012-01-13T01:41:47.270 に答える