• 締切済み

divでスクロールの位置を記憶するには？

始めまして。よろしくお願いします。 ブログのトップページがdivで2つに分かれています。 左側はメニュー画面で非常に縦長になっていてスクロールして表示しています。 メニュー画面のリンクをクリックするとメニュー画面のスクロールバーが一番上まで言ってしまって困っています。 リンクをクリックしてもスクロールバーの位置を変えない良い方法はないでしょうか？ どなたかよろしくお願いします。

みんなの回答

回答No.2

通常の方法では難しそうですねー。 ＦＣ２で自分の使用テンプレートの修正が簡単に可能なことは知ってますが サーバー側でＰＨＰで置換書き換えされる部分とぶつからないように 隙間を見つけてスクリプトを書かないといけないし 動的にメニュー上のリンクタグを全て書き換え必要になるので ＰＨＰとの取り合いが難しそうですな・・・ 少し時間がかかります。 暇な時にやってみますので、しばらくお待ち下さい。 .

burobo
質問者

補足

えっ・・・！？なんか難しそうですね・・・。 フレームの時のようにちょこっと書き足せばいいのかと思ってました・・・。どうりで検索しても（難しそうなのしか）出てこないわけですね。 ＞暇な時にやってみますので、しばらくお待ち下さい。 申し訳ないです。本当に暇なときでいいので・・・宜しくお願いします。

回答No.1

＞メニュー画面のリンクをクリックすると ということは別画面に飛んでるわけですよね。 で、別画面にも同じメニューがあり、そのスクロールが一番上に戻る。 てっ、別画面のメニューですから、スクロールが元に戻るのは、当たり前ですよね。 それを、どうしても、前の画面と一緒の位置にして メニューを複数作ってるようには見せたくないと・・ フレームで作れば問題ないんじゃないでしょうか？ そこを、どうぉ～しても・・という場合は、ソースを貼って下さい。 スクロールの現在位置を次ページに渡せば可能かもしれませんので、 とりあえずソース見せてください。 .

burobo
質問者

補足

arenani_sorenaniさん 回答ありがとうございます。 ＞そこを、どうぉ～しても・・という場合は、ソースを貼って下さい。 FC2ブログの共有テンプレートの「bbs」というもので、ローカルで動作確認できるか分かりませんが、ソースを貼らせていただきます。 出来れば、フレームでなくてdivのまま実現したいなと思っています。 宜しくお願いいたします。 ＃文字数制限の為、<body>～</body>および途中省略しています。 ＃====Main Block====と===Menu Block===の２分割で 　Menu Blockがメニューとして画面の左側にスクロール付きで 　表示されています。 <body><!--/not_permanent_area--> <!--permanent_area--><body id="permanent"><!--/permanent_area--> <!--not_permanent_area--> <div id="main"> <!-- ==========Main Block================= --> <ul id="admin"> <li><a href="<%url>?xml" title="RSS">RSS 1.0</a></li> <li><a href="./admin.php" title="管理人専用">[admin]</a></li> </ul> <h1 id="blog-title"><%blog_name></h1> <div id="navigation"> <h2><!--category_area--><%sub_title>＠<!--/category_area--><!--date_area--><%now_year>年<%now_month>月＠<!--/date_area--><%blog_name></h2> <p class="prev-next-nav"> <!--nextpage--><a href="<%nextpage_url>" title="前のページ"><< 前のページ</a><!--/nextpage--> <!--date_area--><a href="<%prev_month_link>"><< <%prev_year>年<%prev_month>月</a><!--/date_area--> <!--not_index_area--> | <a href="<%url>" title="トップページへ">Home</a><!--/not_index_area--> <!--date_area--> | <a href="<%next_month_link>"><%next_year>年<%next_month>月 >></a><!--/date_area--> <!--prevpage--> | <a href="<%prevpage_url>" title="次のページ">次のページ >></a><!--/prevpage--> </p> <form class="search" method="get" action="./"> <p>ブログ内検索 <strong>キーワード</strong> <input id="search-text" type="text" name="q" size="20" value="" /><input id="submit" type="submit" value="検索" /> </p> </form> </div><!-- /navigation --> <!--省略--> <!--permanent_area--> <hr /> <div id="trackback-area"> <h2 id="trackback-top">トラックバック<!--deny_tb-->は受け付けていません<!--/deny_tb--></h2> <ol class="trackback"> <li><span class="name"><%blog_name></span> <%topentry_year>/<%topentry_month>/<%topentry_day>（<%topentry_wayoubi>） <%topentry_hour>:<%topentry_minute>:<%topentry_second> <dl> <!--allow_tb--><dt>この記事のトラックバックURI</dt><dd><%trackback_url></dd><!--/allow_tb--> <!--preventry--><dt>次の記事</dt><dd><a href="<%preventry_url>" title="<%preventry_title>"><%preventry_url></a></dd><!--/preventry--> <!--nextentry--><dt>前の記事</dt><dd><a href="<%nextentry_url>" title="<%nextentry_title>"><%nextentry_url></a></dd><!--/nextentry--> </dl> </li> <!--deny_tb--> </ol> </div> <!--/deny_tb--> <!--/permanent_area--> <!--/topentry--> <!--trackback_area--> <!--trackback--> <li id="trackback<%tb_no>"><span class="name"><a href="<%tb_url>" title="<%tb_title>"><%tb_blog_name></a></span> <%tb_year>/<%tb_month>/<%tb_day>（<%tb_wayoubi>） <%tb_hour>:<%tb_minute>:<%tb_second> <p class="trackback-excerpt"><%tb_excerpt></p> </li> <!--/trackback--> </ol> </div><!-- /trackback-area--> <!--/trackback_area--> <!--not_permanent_area--> <hr class="ad" /> <p class="ad"><%ad> <%ad2></p> <hr class="ad" /> </div> <!-- ==========/Main Block================= --> <!--/not_permanent_area--> <!--not_permanent_area--> <div id="menu"> <!-- ==========Menu Block================= --> <h2 id="archives">Archives</h2> <dl> <dt>月別</dt> <!--archive--> <dd><a href="<%archive_link>" title="「<%archive_year>年<%archive_month>月」の記事一覧"><%archive_year>-<%archive_month> : <%archive_count></a></dd> <!--/archive--> <!--省略--> <h2 id="links">Links</h2> <ul> <!--link--> <li><a href="<%link_url>" title="<%link_name>"><%link_name></a></li> <!--/link--> </ul> </div> <!-- ==========/Menu Block================= --> <!--/not_permanent_area--> </body>

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • スクロールバーの位置指定

    OS情報：MacOSX ブラウザ情報：Safari 今作成中のホームページの左側にボックスをつくってその中にクリックすると別ページに飛ぶリンクを縦に並べています。ボックス内はCSSでオーバーフロー自動の設定にしているので、下の方のリンクはスクロールしなければ見えません。今の状態は見えているリンクをクリックして別ページに飛ぶ分にはいいのですが、スクロールしてリンクをクリックした場合、別ページに移動した時、またスクロールがトップの位置に戻ってしまいます。これだとそれ以下にあるリンクをクリックしたい時に、いちいち下方向にスクロールしながらでないといけません。そこで、クリックして移動した後、そのページのリンク名が表示される位置でスクロールバーを固定できないか…ということなのですが、何かよい方法はないでしょうか？

  • 表示時にdiv要素のスクロール位置を指定したい

    上部にヘッダー、左にメニュー、右にコンテンツ、下部にフッターという、２カラムのHTMLなのですが、左右のdiv要素にoverflowでスクロールをそれぞれ付けています。 問題なのは、この左側のメニューで、サイト内リンクをクリックすると新しくリンク先ページが開くので、当然スクロール値は０になります。 後方のボタンの場合、どのボタンを押したのかわからなくなってしまいます。 ということで、javascriptでスクロールの位置を調整したいのです。 私は初心者でして、見よう見まねで下記のように書いてみたのですが、スクロール値は０のままです。 根本的に間違っているのかすら解らずで、ご教授願いたいと思い投稿させて頂きました。 宜しくお願いいたします。 window.onload = function(){ sub_scroll.scrollTo('se'); } ※sub_scrollは左のdiv要素のidです。 seは先頭にしたい箇所のidです。

  • スクロールバーの位置について

    ＨＴＭＬで縦スクロールバー付で表示させた場合、通常ですとスクロールバーは一番上（画面のＴＯＰ）を表示ですが、スクロールバーを一番下（画面の下）をデフォルトにする方法はありますか？ ご教授ください。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • 【Firefox】前のページへ戻るとスクロール位置が上に戻る

    Firefox（バージョン 2.0.0.7）を使用しています。 画面をスクロールしてページの下の方にあるリンクをクリックして、クリック先のページを表示した後、前のページに戻ると、さきほどスクロールした位置ではなく、上に戻って表示されることがあります。IEのようにスクロールした位置を保持する設定、または、アドオンなどがあれば教えてください。

  • 【Firefox】戻るボタンを押すとスクロール位置が一番上を表示してから、前回の位置を表示されてしまう

    Firefox（バージョン 3.0.10）を使用しています。 画面を数行スクロールしてページの下の方にあるリンクをクリックし、クリック先のページを表示した後、前のページに戻ると、さきほどスクロールした位置ではなく、一番上に戻って表示された後、ページの読み込みが全て完了してから前回の数行スクロールした位置で表示されます。 IEのように一番上に戻らないように表示させるようにするには、どうすればいいでしょうか？

  • フレームのスクロール設定について

    HPリニューアルにともない、スタイルシートとフレーム（上に1つ、下に右左２つの計３つのフレーム）を使ってプログラミングしているのですが、スクロールバーの設定がうまくできません。 TOPページにはスクロールバーは表示したくないので、フレームと一緒にスクロール非表示の設定にしてあるのですが、そうすると他のページにリンクせててもスクローリングされません。 autoに設定するとTOPページにもスクロールバーが表示されてしまい、ほかになにか方法があれば教えていただきたいです。 よろしくおねがいいたします。

    • ベストアンサー
    • HTML
  • IFRAMEページ表示について

    html超初心者で相当ハマッテいます・・・。 　_menu__main______ 　|　　 |　　　　　　　|←のようなページをIFRAME 　|　　 |　　　　　　　|　を使って作成し、左にmenu/ 　|　　 |　　　　　　　|　右にそのリンク先を表示 　|　　 |　　　　　　　|　させようとしています。 　|　　 |　　　　　　　|　menuボタンをクリックした 　|　　 |　　　　　　　|　ときにスクロールバーが 　--------------　 下りていると、次に表示されたページも同じスクロール位置で表示されてしまいます。 menuボタンをクリックしたとき、ページのトップにリンク先のページも表示させるにはどうしたらいいのでしょうか？ ちなみに <a href="***.html#TOP" target="main">～</a>としてみるとスクロールが一応は上がったのですが、微妙におかしくて・・・。 どなたかご教授いただけませんか？

    • ベストアンサー
    • HTML
  • MSFlexGridのスクロールバー位置

    VB5(SP3)です。 ある検索条件でMSFlexGridに100行表示させた後、垂直スクロールバーで50行ほど下方向にスクロールさせます。 この状態で違う検索条件で1行表示させた時、垂直スクロールバーの位置が変わらないため（ＴＯＰにこない）に何も表示されません。垂直スクロールバーを上方向にスクロールさせれば出てきます。 垂直スクロールバーをＴＯＰ位置に持ってくる方法はありませんか？ MSFlexGrid.VscrollBar.Value=0とかあれば・・・・

  • JQueryで画面中央にDIVを配置したい

    いつもお世話になります<(_ _)> PC及びスマートフォンで表示した際にスクロールバーが表示され、スクロールできるページがあります。 (bodyの高さは、1500pxほどあります) そこに、以下DIVを画面中央に表示したいのですが <div id="loading_image" style='position:absolute;'><img src="loading.gif" /></div> styleでtop:50%としたら、ページ全体(1500px)の真ん中あたりに表示されるのですが、ページが長いのでスクロールが一番上の状態だと隠れて表示されません。 ※ページ真ん中ぐらいにスクロールすれば表示されています。 このDIVを「今、表示されているエリアの中央」に移動させる事はできるのでしょうか？ JQueryで位置を動かすにも、どのようにして「今、表示されているエリアの中央」の座標を取得するのか、わかりません。 ご存じの方、何卒ご教授のほど宜しくお願い致します<(_ _)>

    • ベストアンサー
    • CSS
  • スクロールバーの位置

    IE6.0でスクロールバーの位置を取得できませんか？ というか、ページの一番上から数えて、何ピクセルスクロールしたかを取得したいです

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する