スクロールできない?! フレームを使ったファイルの真ん中寄せにする方法とは?

このQ&Aのポイント
  • フレームを使ったファイルindex2.htmlを呼び出して、HP全体を真ん中寄せにする方法を試しましたが、マウスの真ん中のちょぼでスクロールできなくなってしまいました。どうすればスクロールバーをちょぼで操作できるようにできるでしょうか?
  • フレームを使ったファイルの真ん中寄せでHP全体を表示するために、index2.htmlを呼び出しましたが、マウスの真ん中ではスクロールできなくなってしまいました。スクロールバーをドラッグアンドドロップで操作することはできるのですが、ちょぼで操作できるようにするには、どうすればいいでしょうか?
  • フレームを使用してindex2.htmlを呼び出してHP全体を真ん中寄せにしましたが、マウスの真ん中のちょぼでのスクロールができなくなってしまいました。どうすればスクロールバーをちょぼで操作できるようにできるでしょうか?
回答を見る
  • ベストアンサー

スクロールできない

お世話になっています。 下のようなファイルによって、フレームを使ったファイルindex2.htmlを呼び出して、HP全体を真ん中寄せにしました。 するとマウスの真ん中のちょぼでスクロールできなくなってしまいました。 <body> <DIV ALIGN="center"> <iframe name="cal-iframe" src="index2.html" width="920" height="2500" scrolling="yes" frameborder="0" marginwidth="0" marginheight="0"> </iframe> </DIV> </body> スクロールバーをドラッグアンドドロップで操作することはできるのですがちょぼで操作できるようにするには、どうすればいいでしょうか?

  • HTML
  • 回答数3
  • ありがとう数1

質問者が選んだベストアンサー

  • ベストアンサー
noname#56882
noname#56882
回答No.2

試しに作ってみましたが、確かにマウスの中ホイールで反応しませんでした。 どうも「height="2500"」に問題があるのでは?と思います。 height="500"(あくまで例です)にすると、きちんと中ホイールで反応しましたよ。 もしくはパソコンの解像度の関係で「height="2500"」が高すぎるような気がします。

その他の回答 (2)

noname#56882
noname#56882
回答No.3

#2です。言葉足らずな部分がありましたので追加です。 中ホイールで反応したのは「インラインフレームの部分」ということです。 画面全体の中ホイールはheight="2500"でも動きました。 解釈が間違っていましたら大変失礼致します。

tanukiman
質問者

お礼

回答ありがとうございます。 はじめ画面全体もインフレーム部分もスクロールすることができませんでした。 おっしゃる通りheightを小さくするとインフレーム部分をスクロールすることができました。 とても助かりました。ありがとうございました☆

  • moveline
  • ベストアンサー率72% (35/48)
回答No.1

その前に「ちょぼ」とは何なのかわからないのですが...

tanukiman
質問者

補足

すみません。説明不足でした。 マウスの真ん中にある、小さな回せる部分です。 通常それを回すとスクロールできるはずなのです。

関連するQ&A

  • インラインフレームの中央寄せについて

    ブログのサイドバーに、アマゾンのウィジェットを貼り付けています。 しかし、<iframe・・ align="center">にしても、中央寄せにならず、左寄せになっている状態です。 元のソースは以下になります。 <iframe src="http://rcm-jp.amazon.co.jp/e/cm?~(省略)~" marginwidth="0" marginheight="0" width="120" height="240" border="0" frameborder="0" style="border:none;" scrolling="no"></iframe> どのようにすれば、サイドバーに中央寄せとなるのでしょうか? ご回答よろしくお願い致します。

  • 複数の<iframe>内にHTMLをランダム表示

    以下のようなソースで、ランダムにHTMLをIFRAMEに読み込むソースを書いています。 (Javascript) window.onload = function(){ var c = 23; //ランダムに表示するiframe内URLの数 var ifm = document.getElementById('aaa');//frameIDを入力 var r = Math.floor( Math.random() * c ); var urls = new Array(); urls[0] = '../text/1.html'; urls[1] = '../text/2.html'; urls[2] = '../text/3.html'; urls[3] = '../text/4.html'; urls[4] = '../text/5.html'; urls[5] = '../text/6.html'; urls[6] = '../text/7.html'; urls[7] = '../text/8.html'; urls[8] = '../text/9.html'; urls[9] = '../text/10.html'; ifm.src = urls[r]; } (HTML) <iframe src="#" id="aaa" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> このような要領で、 id="aaa"にはtextフォルダ内のファイル1.html~10.htmlのうちからランダムで、 id="bbb"にはtextフォルダ内のファイル11.html~20.htmlのうちからランダムで、 id="ccc"にはtextフォルダ内のファイル21.html~30.htmlのうちからランダムで、 ・・・・ といった感じで以下のようなソースでそれぞれ読み込めればと思っているのですが、どうやったら可能でしょうか? <iframe src="#" id="aaa" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> <iframe src="#" id="bbb" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> <iframe src="#" id="ccc" frameborder="0" marginwidth="0" width="115" marginheight="0" scrolling="no"></iframe> javascriptにかんしてはあまり詳しくありませんので、ちょっと改変してコピペするくらいまでのソースを教えていただけませんでしょうか? よろしくおねがいします。

  • htmlにcgiを組み込んで、HPを作成しましたが、スクロールの位置を

    htmlにcgiを組み込んで、HPを作成しましたが、スクロールの位置を上部に移動したいです。 aaa.htmlの中身: <iframe src="bbb.cgi" height="800" width="480" frameborder="0" marginheight="0" marginwidth="0" scrolling="no"></iframe> bbb.cgiは、formで質問を投げて、その答えをまた、bbb.cgiに結果を表示します。 でも、質問の画面でスクロールが一番最後に位置した場合、結果表示の画面もスクロールが一番最後になってしまい、ユーザがスクロールをまた上に移動しないと結果が見えないです。 結果表示の画面では、スクロールを一番上部にしたいですが、aaa.htmlとbbb.cgiのbody tagにwindow.scrollTo(0,0)にしても、質問画面のスクロールの位置のままです。 よろしくお願い致します。

    • ベストアンサー
    • HTML
  • 目次つねに表示をするには・・・!?

    本を読んで <div id="menu" class="gureisyouClass"> <nolayer><IFRAME name="sample" border="0" frameborder="0" marginheight="0" marginwidth="0" src="iframe.html" width="210" height="720" scrolling="no"></IFRAME> </nolayer><ilayer src="iframe.htm" width="210" height="720" scrolling="no"></ilayer></div> 「iframe.html」という目次ページを作ってどのページをクリックしても目次をつねに表示するようにしました。けれど、目次が増えていくとheight="720"を増やす作業を全ページやり直していかなければなりません。いろんな方のHPソースをみるとdivの中にテーブルで目次項目を全ページ記述してあります。目次が増える都度みなさん全ページやり変えてらっしゃるのですか?どうすればいいのでしょうか、とても困っています。

    • ベストアンサー
    • HTML
  • リンク元の引数を取得してjavascriptを実行したい

    リンク元に引数を入力して、リンク先でページのインラインフレームのページが指し換わるjavascriptを実行させたいです。 実行させたいjavascriptは function change(URL1,URL2) { document.getElementById('contents1').innerHTML = '<iframe src="'+URL1+'" width="620" height="343" frameborder="0" scrolling="no" name="myFrame1" marginwidth="0" marginheight="0" hspace="0" vspace="0"></iframe>' ; document.getElementById('contents2').innerHTML = '<iframe src="'+URL2+'" width="620" height="215" frameborder="0" scrolling="no" name="myFrame2" marginwidth="0" marginheight="0" hspace="0" vspace="0"></iframe>' ; } 引数からURL1とURL2に代入したいです。 アドバイスよろしくおねがいいたします。

  • フレームで表示すると

    自分でフレームを組んだのですが、 IEだと大丈夫だったのですが、 NN4.7で崩れてしまいました。 フレームの間に白い線が入ってしまいます。 原因がわからず、ここに質問しております。 一つの画像を縦3つに分け、真ん中は横3つに分け、 合計5マド構成のフレームにしたいと思っています。 インラインフレームのような感じです。 インラインフレームだとNNでは表示されないので、 このような形にしようと思いました。 下記のようなソースでは何か問題があるのでしょうか。 教えてください、宜しくお願いします。 <frameset rows="*,*,*" frameborder="0" framespacing="0" border="0"> <frame src="top.htm" marginwidth="0" marginheight="0" scrolling="no" noresize> <frameset cols="*,*,*" frameborder="0" framespacing="0" border="0"> <frame src="midddle_left.htm" marginwidth="0" marginheight="0" scrolling="no" noresize> <frame src="midddle_midddle.htm" marginwidth="0" marginheight="0" scrolling="yes" noresize> <frame src="midddle_right.htm" marginwidth="0" marginheight="0" scrolling="no" noresize> </frameset> <frame src="bottom.htm" marginwidth="0" marginheight="0" scrolling="no" noresize> </frameset>

  • 複数のiframeの読み込みについて

    とある事情があり、制限がかなりある中、何とかiframeでやりくりをしていたのですが、 下記の通り(コード、画像参照)ページを組んだところ、 IE11、chrome34.0で確認をしたところ、下記の通り表示がおかしくなってしまいました。 制限が色々あるため、少しイレギュラーなコードの組み方をしており、どこが原因なのかがわからない状態です。 状況などをまとめましたので、お手数おかけいたしますがご教授いただけますでしょうか。 ■■■ページの概要について 恐らく下記のコードと添付の画像を見ていただいた方がわかりやすいと思いますが、制限や概要を記述しておきます。 ・表示させる方のページをA.html(親ページ)、iframe内で読み込むページをB.html(子フレーム)とします。 ・親ページの方にはかなり使用できるタグなどに制限があり、javascriptが使用できません。文字数にも制限があります(子フレームの方は自由です。) ・親ページも子フレームも触れるものの、この2ページは別ドメインです。(下記の例は相対パスで記述しています) ・子フレームの内容は、下記の例では内容が少ないですが、実際にはかなり長いページになります。ただ、ページは分けない方向でお願いします。 ・iframeはスクロールが出ないように高さを調節しています。 ・ページ内リンクを使用したいのですが、iframe内だけではなく、親ページから見た状態でページの途中に飛ばしたいため、  親ページの方にページ内リンク用のアンカーをつけ、複数のiframeで子フレームの内容を表示させています。 ・子フレームのコンテンツ毎にiframe表示用のアンカーをつけ、親ページで細かくiframeを分けて表示させています。 ・(ページ内リンクは親ページの方に記述することも出来ます。) ちなみに過去に次のような記事を見つけましたが、どちらも試すこともできない状態です。 http://okwave.jp/qa/q1105662.html http://okwave.jp/qa/q2938546.html ■■■表示のエラーについて(サーバ上でも、ローカルでも同じような状態です。) ・ページを読み込むと、一番上ではなく、一番下のiframeのところで止まります。  (⇒ページが読み込むと同時に一番上に行ってほしいです。) ・ページ内リンクを付けていますが、リンクを押しても該当のヶ所に飛ばず、  読み込むように少しページがぶれるのですが、元の位置のままです。 ・IE11のみですが、リンクで使用している画像がぼやけて表示されます。  (外部CSSで文字の背景に設定しています。) ■■■コードについて ◆A.html(親ページ) ※JSは使用不可です。 ※<body>は触れません。 ※B.htmlのページとは別ドメインです。 <!--ページ内リンク--> <iframe src="B.html#Blink" frameborder="0" width="850" height="200" marginwidth="0" marginheight="0" scrolling="no"></iframe> <!--ここから#Baの内容--> <a name="linkAa" id="linkAa"></a> <iframe src="B.html#Ba" frameborder="0" width="850" height="580" marginwidth="0" marginheight="0" scrolling="no"></iframe> <!--ページ内リンク--> <iframe src="B.html#Blink" frameborder="0" width="850" height="200" marginwidth="0" marginheight="0" scrolling="no"></iframe> <!--ここから#Bbの内容--> <a name="linkAb" id="linkAb"></a> <iframe src="B.html#Bb" frameborder="0" width="850" height="595" marginwidth="0" marginheight="0" scrolling="no"></iframe> <!--ページ内リンク--> <iframe src="B.html#Blink" frameborder="0" width="850" height="200" marginwidth="0" marginheight="0" scrolling="no"></iframe> <!--ここから#Bcの内容--> <a name="linkAc" id="linkAc"></a> <iframe src="B.html#Bc" frameborder="0" width="850" height="565" marginwidth="0" marginheight="0" scrolling="no"></iframe> ◆B.html(子フレーム) ※JSは使用可です。 <div class="pageLink"> <a name="Blink" id="Blink"></a> <ul> <li><a href="A.html#linkAa" target="_top">#linkAaへリンク</a></li> <li><a href="A.html#linkAb" target="_top">#linkAbへリンク</a></li> <li><a href="A.html#linkAc" target="_top">#linkAcへリンク</a></li> </ul> </div> <a name="Ba" id="Ba"></a> <div>Baの内容</div> <a name="Bb" id="Bb"></a> <div>Bbの内容</div> <a name="Bc" id="Bc"></a> <div>Bcの内容</div> 以上です。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • 自動再生をとめても再生されます

    <iframe src='http://www.vlive.tv/embed/52671?autoPlay=false' frameborder='no' scrolling='no' marginwidth='0' marginheight='0' WIDTH='544' HEIGHT='306' allowfullscreen></iframe> 自動再生しないように、falseにしているのですが、スマホでは止まるのですが、グーグルクロームでは自動再生されます。 どのようにタグを変えたら自動再生されないでしょうか? 教えてください、よろしくお願いいたします!

    • ベストアンサー
    • HTML
  • インラインフレーム

    初めまして。初歩的なことかもしれませんが、 よろしくお願いいたします。 私のHPは、メニュー部分をインラインフレームを使っています。 最初は、そんなにメニュー項目がなかったので、高さ設定をそんなに大きく取ってませんでしたが、メニューの項目を追加していくにあたり、設定していた高さでは足りなくなりました。 スクロールにはしたくありません。 毎回、高さ設定をしなおさずに、うまく入れられることは出きますでしょうか? ちなみに、インラインフレームのタグは、 <IFRAME name="menu" border="0" frameborder="0" marginheight="0" marginwidth="0" src="menu.html" width="143" height="1600" scrolling="no" title="メニュー">このページはインラインフレームを使用しています。</IFRAME> です。 よろしくお願いいたします。

  • 変動する場合のiframeの高さ指定について

    横2つに分けたページ(index.htm)があり、スクロールバー非表示にしてあります。 左(left.htm)右(raight.htm)にそれぞれiframeが入っていて、これにスクロールバーが表示されます。 この時、ウィンドウの大きさを変えても常に一番最後までスクロールできるような高さ指定の方法はありますでしょうか? なにか良い知恵がありましたら教えてください。 よろしくお願いします。 --index.htm <html> <head> <title>サンプル</title> </head> <frameset rows="*" cols="220,*" framespacing="0" frameborder="no" border="0"> <frame src="left.htm" name="left" frameborder="no" scrolling="no" noresize> <frame src="raight.htm" name="raight" frameborder="no" scrolling="no"> </frameset> <noframes> <body></body></noframes> </html> --left.htm <html> <head> <title>左</title> </head> <body bgcolor="#66CCFF"> <div align="center"> ここにメニュー<br>ここにメニュー<br>ここにメニュー<br> ここにメニュー<br>ここにメニュー<br>ここにメニュー<br> <iframe src="in_left.htm" name="in_left" width="190" height="100%" frameborder="0" scrolling="auto"></iframe> </div> </body> </html> --raight.htm <html> <head> <title>右</title> </head> <body bgcolor="#FFFFCC"> ここにリード文<br>ここにリード文<br>ここにリード文<br> ここにリード文<br>ここにリード文<br>ここにリード文<br> <div align="center"> <iframe src="in_raight.htm" name="in_raight" width="90%" height="100%" frameborder="0" scrolling="auto"></iframe> </div> </body> </html>

    • ベストアンサー
    • HTML

専門家に質問してみよう