下の画像で図解したレスポンシブ Web レイアウトを使用しています。赤い領域は画面に固定され、緑の領域は個別にスクロール可能なセクション (青 = スクロールバー) です。
私は疑問に思っています-このレイアウトのメインコンテンツセクション（右側の緑色の領域）を取得し、それをビューポート自体であるかのように処理して、コンテンツとスタイルが機能するようにする方法はありますか（iframeなし）それはそれ自身の独立したフルスクリーンでしたか？
私がこれをやろうとしている理由は、すべてのページをより狭いセクションに収まるように調整することなく、2 番目の Web サイトのコンテンツをこのメイン コンテンツ セクションに直接収めることをできるだけ簡単にしたいからです。サイトの。
2 番目のサイトは、スキャフォールディングに twitter ブートストラップを使用して構築されました。コンテナはすべて誰かのビューポート サイズに合わせて作成されるため、すべてのスキャフォールディングを調整しなければ、わずかに狭いコンテンツ エリア (左側のサイドバーを考慮) にうまく収まりません。 . 多くのページですべてを調整する必要はありません。そのため、ちょうど収まるようにすることができるかどうかを確認するためのハックを探しています (何かが存在することを指で交差させます!)
さらに、左側のサイドバーは折りたたみ可能であるため、メイン コンテンツ セクションがビューポートの幅全体を占める場合があります。したがって、動的に調整したいと思います。
3つのオプションがあるようです：
- 2 番目のサイトの各ページに目を通し、各ページのすべての足場を作り直して、わずかに狭いセクションで動作するようにし、基本的に左側のサイドバーを最初のスパン列として扱い、次にサイト全体を調整して残り幅。 このオプションは実際には機能しません。サイドバーが折りたたまれている場合、メイン コンテンツ エリアが全幅を占めて狭くなってしまうからです。
- iFrame を使用してください - すべての影響があるため、これは考慮していません。
- なんらかの方法でメイン コンテンツ エリアを独自のビューポートとして扱い、ビューポート自体またはフル スクリーンのように、すべてのスキャフォールディングがそのサイズに合わせて調整されるようにします。
これはどういうわけか可能ですか？
おそらく、さらに優れた代替ソリューションはありますか?
ありがとう！