問題タブ [reflow]

絶対位置の要素があり、それを左に変更すると、上の位置はその親の子にリフローしますか？また、左右の軸によって絶対的に配置されているため、影響を受けない場合は、自分の子についてはどうでしょうか。

要素の幅/高さを変更しても、親とその子では重要ではない場合はどうなりますか？

これが私が探しているものです。

出力テキストをフォーマットして、80列で単語を折り返し（またはユーザーが構成可能）、ユーザー定義のインデントを許可するライブラリまたはメソッドを見つけたいと思います。

私はそれを作成できることを知っていますが、これを行うライブラリがすでに利用可能であると思います。グーグルで調べてみたところ、iomanipのページが見つかりました。これにより、自分で作成するためのアイデアが得られました。

Boostライブラリをざっと検索しましたが、完全に一致するものは実際には見つかりませんでした。

私は組み込みオペラの実装に取り​​組んでおり、実際のパフォーマンスをテストしたいと考えています。私はsunspider jsのベンチマークを行っており、html/cssのパフォーマンスを今すぐ知りたいです。

オペラのための良いリフローベンチマークはありますか?

私は他の誰かのコードをクリーンアップしてvimで作業しています。コメントが一貫してフォーマットされるように、コメントをリフローしたいと思います。

例えば：

になります：

したがって、コードのコメントを簡単に解除し、段落をリフローしてから、インデントを保持したままコードを再コメントするワークフロー。これを正確に実行する既存のプラグインがある場合、それは素晴らしいことです。

キャンバスを使用せずに JavaScript ゲームを作成しています。速度を上げるために、画面をサイクルごとに 1 回だけリフローさせたいと考えています。documentFragment が名前付き要素を置き換える方法はありますか?

編集: javascript ガイドは、replaceChild() を documentFragment で使用できることを示唆していますが、例は複数のリフローを暗示しているようです:

が要素内にネストされているtext-transform場合にCSSプロパティによってトリガーされるように見える奇妙なレイアウトのバグに遭遇しました。Safari（5.1.2）でも問題が発生しましたが、この最小限のテストケースはChrome（17.0.963.56）でのみトリガーされます。inline-blockblock

特に興味深いのは、開発者ツールを開いて[要素]タブに保持すると、正しいレイアウトがトリガーされることです。私の推測では、CSSルールとDOM構造の組み合わせにより、Webkitエンジンがページのリフローの実行を見逃していると考えられます。

text-transformこれは、ルールが削除されたか、div要素が削除されたかに応じて、Chromeでレンダリングされる2つの方法を示す2つのスクリーンショットです。

プロパティを使用したいのtext-transformですが、これが既知のバグであるかどうか、および動作をトリガーしないようにするために何ができるか疑問に思っています。リフローイベントを明示的にトリガーできる場合でも十分な場合があります。

背景：
WebGLキャンバスを使用して3Dコンテンツを表示するHTMLページがあります。オーバーレイされているのは複数<div>で、インラインCSSによって配置され、position: absoluteおよびに関連するディメンションがtopありleftます。

質問：
3Dコンテンツのビューを更新するとき（たとえば、すべてを少し回転させるとき）、オーバーレイされたものをすべて移動して<div>、3D空間の同じ場所にとどまるようにする必要があります。
Webページを更新して、再描画が1回だけになるようにするにはどうすればよいですか？

最初にWebGLを再描画し、次にn を反復処理すると、フレームごと<div>にn +1の再描画が行われます。少なくとも30fpsを取得する必要があるアニメーションでは、これはあまり良くありません...

注：
次のような他の質問も知っています：
複数のリフローを回避するために、複数のCSSスタイルをバッチで適用する方法はありますか？-しかし、それは1つの要素で複数のCSSパラメーターを結合することについて話します（私はすでにここでそれを使用して2 n +1からn +1まで取得しています...）
単一の再描画/リフローで複数のDOM更新？-しかし、それがここで役立つかどうかはわかりません。n +1の再描画もあると思います...

PS：jQueryはそのプロジェクトですでに使用されているため、許可されています。

ラジオ ボタンの機能を再現できる CSS ツールキットはありますが、グリッドに配置された写真や画像を使用していますか? たとえば、レンタカー サイトの自動車モデルのグリッドでは、ユーザーは車の写真をクリックして、レンタル アプリケーションに適した車両を選択する必要があります。

これは HTML 選択メニュー ウィジェットに似ていますが、次の点が異なります。

• レイアウトはグリッドであり、項目の行ではありません (つまり、折り返す必要があります)。
• 現在選択されているアイテムは永続的で常に表示され、オプションでチェックマーク (または選択を示すその他のアイコンベースのインジケーター) が表示されます。
• ブラウザのサイズが変更されたときに、グリッドがインテリジェントに配置される (行と列が再計算される) と便利です。
• また、単一選択 (ラジオ ボタン) モードと複数選択 (チェックボックス ボタン) モードのどちらかを選択できるオプションがあると便利です。

これは簡単だと思っていましたが、このようなものを見つけるのに本当に苦労しました。JQuery UI ボタン​​の機能は近いですが、(私が思うに) 画像中心のボタンやリフロー グリッドは提供していません。

900 行以上の非常に大きな html テーブルがあります。行をループし、フィルターの値に応じて行を非表示/表示することで、フィルター処理を有効にしました。

これが問題です。500 行以上を非表示/表示すると、ブラウザーがリフローでビジー状態になっている間、ページが完全に応答しなくなります。フィルタリングする前にテーブルを非表示にしたり、テーブルを複製してからテーブルを置き換えたりしようとしましたが、ブラウザーの再描画中に「アニメーション化された」読み込み画像を表示できないため、応答しないという問題が残ります。

ページネーションはオプションではなく、遅延スクロールもできません。

ループは次のとおりです。

Windows XP で Raphael 2.01、Firefox 12.0 を使用しています。

オブジェクトの連続モーションを試しました (トゥイーン アニメーションではありません)。スクリプトによる負荷は軽いと思いますが、PCの冷却ファンの音が大きくなります！

原因と解決策が知りたいです。

(ステップ)

• ドキュメント上にいくつかの円オブジェクト (5 ～ 10 個) を設定します。

• 彼らは先に進みます。原稿の端に触れると元に戻りますが（反対方向に動きます）、動きは遅くなります。

• Google Chrome のタスクマネージャーで PC の負荷を確認すると、メモリ使用量がどんどん大きくなっています (40MB ===> 150MB ===> ...)。

（脚本）

http://jsfiddle.net/JsL46/3/

*申し訳ありません。コードを「jsfiddle」に貼り付けると、円のオブジェクトが表示されますが、実行されません。