0

アプリケーションを WPF から HTML/Javascript に移植していますが、アプリケーションに必要なレイアウトに問題があります。

このレイアウトは、使用可能な画面全体を占める必要があります。実際にはjquery uiタブに配置されるため、メニュー、ロゴ、およびタブを使用すると、技術的には画面全体にはなりません。私はこれの一部を機能させましたが、すべてが一緒ではありません。

左側にはカスタムの滑りやすいマップがあり、水平方向と垂直方向の両方で可能な限り多くのスペースを占めるようにしたいと考えています.

右側には上部と下部にいくつかのフィルターがあり、中央にはフィルターの結果が表示されます。結果はかなり長くなる可能性があるため、Web サーバーから大量のコンテンツが取り出される場合は、垂直方向にスクロールする必要があります。

私が助けを必要としているのは、これをサポートするための基本的なレイアウトだけです。どんな助けでも大歓迎です。以下に私のレイアウト図を示します。前もって感謝します！

レイアウトが必要

4

3 に答える 3

0

相対位置と小さな JavaScript を使用することにしました。結果のないエレガントなソリューションを探すのに何時間も費やしましたが、javascript を使用することに決めてから数分しかかかりませんでした。WPFではこんなことが簡単にできるので驚きました。基本的に、window.onresize イベントにアタッチし、垂直方向に拡大する右側のスクロールバーの高さを手動で設定するだけです。とにかくあなたの提案をありがとう。

于 2013-02-26T18:48:00.260 に答える
0

そのdivに、追加しますstyle="max-width: 350px; overflow-y: scroll;"

于 2013-02-25T22:08:45.157 に答える
0

まず、このようなものが必要です (Fluid - Fixed layout と呼ばれます)。Dynamic Drive http://www.dynamicdrive.com/style/layouts/item/css-liquid-layout-21-fixedから取得できる例を次に示します。 -液体/ . この例はレイアウトの反対であるため、余白と幅を「反転」する必要があることを除いて (左から右に置き換える)。

次に、2 番目の div (350x50) をページの下部に配置する必要があります。あなたができることは、そのdivを次のように設定することです：

#small_box
{
    position: absolute;
    right: 0;
    bottom: 0;
    ...
}

上記のリンクはIE6+でも機能します

それが役に立てば幸い。

于 2013-02-25T22:10:40.767 に答える