none
画面分割について RRS feed

  • 質問

  • 丹羽と申します。

    VS2005 にてWebサイトを勉強中です。

     

    ・どうしても解決できそうにないので、投稿させて頂きました。

     

    (経緯)

    下名は、ASPにて作成したWebアプリケーションをASPXにコンバートしつつ、色々と機能面を勉強しています。

     

    既存画面においては、随所でframeset,frameを使用した画面があり、これを同じ様に作成しようとしたところ、

    ASP.NET 2.0 フレームワークおよびVisual Studio2005は、XHTML 1.0 Transitional を対象にしているため、

    廃止要素にframeも含まれるため、利用できない事は、わかりました。

    (『ツール』⇒『オプション』で検証の設定をXHTML 1.0 Frameset に変更しても、該当のWebフォームが

     マスターページを使用しているので、framesetが構文エラーとなってしまいます。)

    それと基本的な設定は、Defaultのままにしたいと思っています。

     

    2005以前のバージョン迄は、使えていたみたいですが。

     

    そこで、フレームセットの代替案は、どのようにしたら良いか悩んでおります。

     

    「作成したい画面」

     _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _

    | _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _

    | _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _| ← マスターページ部分

     Content-----------------------------------------------------

     |                  |                                        |

     | TreeViewにて     |  右側へ表示する内容は、選択されたものに|        

     |   nodeを選択     |  より異なります。                      |

     | 右側へ表示する   |                                        |

     | プログラムを呼び出す|                                        |

     |                  |                                        |

     |                  |                                        |

     |                  |                                        |

     |                  |                                        |

     |                  |                                        |

     |                  |                                        |

     |__________________|________________________________________|

     _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _

    |_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _|  ← マスターページ部分

     

    『質問』

    ①Content内で上記の赤い境界線部分の様に画面を分割する方法を教えて頂きたい。

    ②また、境界線は、ドラッグしてサイズを変更できる様にするには、どのようにするのか。

     

    参考サイト等、ご存知でしたら、ご教示願います。

     

     

     

     

     

     

     

     

     

     

     

    2007年7月26日 4:57

回答

  • niway さん、こんにちは。

     niway さんからの引用
    そこで、フレームセットの代替案は、どのようにしたら良いか悩んでおります。

    <div> 要素の Box-Style のパターンを使えばよろしいかと思います。
    具体的には私のサイトや Blog でやっているのと同じことになります。

    HTML ベースで説明しますと。

    • 左側と右側を <div> 要素でマークアップします。
    • 左側の div 要素のに "left" 右側の要素には "right" などと id を振ります。
    • 左側の div 要素の CSS に position: absolute; を加えます。
    • 左側の div 要素の CSS に任意の大きさで width を設定します。(この値を x とします)
    • 右側の div 要素の margin-left を x の値に変更します。
    これで折り返されることなく分割されるハズです。

     niway さんからの引用
    (2) また、境界線は、ドラッグしてサイズを変更できる様にするには、どのようにするのか。

    私のサイトでもやっていますが、JavaScript などで上記の x の値を変更すれば良いです。

    2007年7月26日 5:29

すべての返信

  • niway さん、こんにちは。

     niway さんからの引用
    そこで、フレームセットの代替案は、どのようにしたら良いか悩んでおります。

    <div> 要素の Box-Style のパターンを使えばよろしいかと思います。
    具体的には私のサイトや Blog でやっているのと同じことになります。

    HTML ベースで説明しますと。

    • 左側と右側を <div> 要素でマークアップします。
    • 左側の div 要素のに "left" 右側の要素には "right" などと id を振ります。
    • 左側の div 要素の CSS に position: absolute; を加えます。
    • 左側の div 要素の CSS に任意の大きさで width を設定します。(この値を x とします)
    • 右側の div 要素の margin-left を x の値に変更します。
    これで折り返されることなく分割されるハズです。

     niway さんからの引用
    (2) また、境界線は、ドラッグしてサイズを変更できる様にするには、どのようにするのか。

    私のサイトでもやっていますが、JavaScript などで上記の x の値を変更すれば良いです。

    2007年7月26日 5:29
  • じゃんめねっと 様

     

    ご連絡ありがとうございます。

    貴殿サイトを参考にして、作成してゆきたいと思います。

     

    2007年7月26日 6:08