none
IE10で互換表示後、画面をフレーム分割した際の横スクロールバーについて RRS feed

  • 質問

  • 私が作成した画面は、
    IE10で互換表示しないとCSSが効かず、正しく表示されません。
    このため、IE10の互換表示を使用して、画面を使用しているのですが、
    以下の問題が発生しております。
     
    もし分かる方がいらっしゃれば、ご教授頂けますでしょうか。
     
    【問題】
    画面を縦2つにフレーム分割しております。
    IE9までは分割した画面毎にそれぞれ横スクロールバーが表示されるのですが、
    IE10を使用すると分割した画面毎にスクロールバーは表示されず、
    まとめて1本の横スクロールバーが表示されます。
    IE9のようにフレーム毎にスクロールバーを表示したいのですが、
    何か方法はありますでしょうか?
    イメージを以下に記述します。
     
    IE9までは、以下の様にフレーム毎にスクロールバーが表示されます。
    ____________
    |      |             |
    |      |             |
    |      |             |
    |      |             |
    |      |             |
    <---><-------->
     
    ※<--->スクロールバーです。
     
    IE10は、以下の様に1本のスクロールバーが表示されます。
    ____________
    |      |             |
    |      |             |
    |      |             |
    |      |             |
    |      |             |
    <--------------->


    2013年7月25日 1:51

回答

  • 実際の記述内容は、以下のイメージになります。
     
    ご提示のHTMLでは、手元のIE10&WIn8環境では再現しませんでした(フレーム毎にスクロールバーが表示された)。
     
    CSS(linkタグ)やscriptタグを除き、jspファイルを別なファイルに差し替えたHTMLで確認をしました。
    そちらで、CSS(linkタグ)やscriptタグを除きjspファイルを別なファイルに差し替えたHTMLで再現するかの確認はできますでしょうか。

    2013年7月26日 23:47

すべての返信

  • 使用しているタグ名とフレーム分割のタグの実際の記述は分かりますでしょうか。
    CSSでスクロールバーを出したい場合、overflow-xやwidthによる制限が有効な場合があります。
     
    IE10ではframeタグやframesetはサポートしていないようですよ。(互換モードの場合、どうかは分かりませんが)
    http://msdn.microsoft.com/en-us/library/ie/ms535250(v=vs.85).aspx
    2013年7月25日 10:23
  • ご連絡ありがとうございます。

    実際の記述内容は、以下のイメージになります。

    何か分かりますでしょうか。

    よろしくお願いいたします。

    <html>
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
        <link rel="stylesheet" type="text/css" href="/xxx/resource.do?resource=default3.css" />">
        <script language="JavaScript" src="/xxx/resource.do?resource=script.js&ver=true"></script>
      </head>
      <frameset rows="*,0,0,0" border="0" frameborder="no">
        <frameset cols="160,*" frameborder="yes" name="frameset">
          <frame src="manual.jsp" name="menu">
          <frame src="body.jsp" name="body">
        </frameset>
        <frame name="print" frameborder="no" noresize>
        <frame name="session_confirm" frameborder="no" noresize src="session_confirm.jsp">
        <frame name="time_act" frameborder="no" noresize>
      </frameset>
    </html>

    2013年7月26日 10:20
  • 実際の記述内容は、以下のイメージになります。
     
    ご提示のHTMLでは、手元のIE10&WIn8環境では再現しませんでした(フレーム毎にスクロールバーが表示された)。
     
    CSS(linkタグ)やscriptタグを除き、jspファイルを別なファイルに差し替えたHTMLで確認をしました。
    そちらで、CSS(linkタグ)やscriptタグを除きjspファイルを別なファイルに差し替えたHTMLで再現するかの確認はできますでしょうか。

    2013年7月26日 23:47
  • IE10で互換表示後 画面をフレーム分割した際の横スクロールバーについて さん、こんにちは
    フォーラム オペレーターの星 睦美です。

    (´・ω・`)さんからの返信が検証の手がかりになるのではないかと思います。
    私のほうで[回答としてマーク] させていただきました。

    もしさらにフォーラムの回答者からアドバイスが必要な場合には、遠慮なく[回答としてのマークの解除] をして、(´・ω・`)さんが返信で検証の方法を書かれていますので、IE10で互換表示後 画面をフレーム分割した際の横スクロールバーについて さんからも同様の方法で確認した内容をお知らせいただければと思います。


    日本マイクロソフト株式会社 フォーラム オペレーター 星 睦美


    • 編集済み 星 睦美 2013年8月2日 1:49 回答としてマーク
    2013年7月30日 7:47
  • ご連絡ありがとうございます。
    調査をしたところ原因が分かりましたので、
    報告いたします。

    まず、根本的な事が間違っておりましたので、
    ご連絡いたします。

    上記にhtmlの記述がありますが、この記述のファイルを呼ぶ前に
    以下のファイルを実行しておりました。

    <html>
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
        <link rel="stylesheet" type="text/css" href="default3.css">
      </head>
      <frameset border="0" rows="100,0">
        <frame src="frame.html" name="frame">
        <frame name="comm" src="comm.html" frameborder="no" noresize>
      </frameset>
    </html>

    「frame.html」の中身が、
    上記で記述したhtmlの記述になります。


    原因ですが、
    <frameset border="0" rows="100,0">
    の「rows="100,0"」部分で、
    「100」と記述するとスクロールバーが表示される事がわかりました。
    また、「rows="*,0"」と記述すると、
    スクロールバーは表示されない事が分かりましたので、
    「*」で記述するにようにいたしました。

    今回問題が発生したOSは、Windows7 32bitです。
    Windows7 64bit、Windows8 64bitは、発生しませんでした。

    以上です。

    2013年10月31日 1:40