0

サイド プロジェクトとして、(Bootstrap 経由で) レスポンシブ レイアウトを構築するための WYSIWYG エディターに取り組んでいます。ズーム/スクロール機能（PDFビューアやPhotoshopに似ています）で動作するように構築し、サイトが内部でレンダリングされている「ウィンドウ」のサイズをユーザーが設定/変更できるようにしたいと考えています。

WYSIWYG エディターがレイアウトを適切に表示するようにするには、それを div 内に配置し、div のサイズを、エミュレートしているブラウザー ウィンドウのサイズに設定します。これは、リキッド レイアウトを使用してすぐに使用できますか? それ以外の場合は、サイズを検出するためにウィンドウの代わりにターゲット div を探すように JS を編集できますが、前者の方法をお勧めします。

ありがとう！

4

1 に答える 1

0

css 絶対配置を使用して、他の html が存在するかどうかに関係なく、div がブラウザーのビューポートの定義された部分を占有するようにすることができます。これは、ブラウザーの端からのオフセットに px を使用するか、パーセンテージ ビューにパーセンテージを使用して実行できます。あなたの例を考えると、「ウィンドウ」を定義して、そのウィンドウのレイアウトに進むことができます。絶対配置された要素の子はデフォルトで絶対配置を継承しないため、子要素は position: absolute コンポーネント内で通常どおりレイアウトされます。

#window {
  position:  absolute;
}

スクロールするコンポーネントを含む絶対配置ウィンドウを含む Bootstrap レイアウトの例として、以下を見てください。

http://jsfiddle.net/timburgess/ZTt5M/

A List Apart では、http://www.alistapart.com/articles/css-positioning-101/で CSS ポジショニングの概要を説明しています。

于 2012-12-07T03:13:11.630 に答える