• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:外部ページから指定場所にリンクをさせる)

外部ページから指定場所にリンクをさせる方法

okmotokunの回答

  • ベストアンサー
  • okmotokun
  • ベストアンサー率59% (92/155)
回答No.1

> link.htmlのsection3の内容部分(link.htmlの下にある、セクション3)が画面中央に来るようにしたいのです。 「画面中央」というのがわかりませんが・・・ hrefの値をパス付き(絶対URL、相対URLのどちらでも)で書けばいいんじゃないですか。 <a href="./link.html#section1">メニュー1</a> <a href="./link.html#section2">メニュー2</a> <a href="./link.html#section3">メニュー3</a>

kureakai
質問者

お礼

ありがとうございます。 早速試したところできました。 情報ありがとうございました。

関連するQ&A

  • アコーディンパネルの別ページからのリンクについて

    こんばんは。 jqueryを使ってアコーディオンパネルを実装したページを作成しました。 通常は全て閉じた状態ですが、 全てのページにパネル1~5へのリンクがあり、それをクリックすると該当のパネルが開いた状態で表示させるには、どんなスクリプトを追加するとよろしいのでしょうか? 以下コードです。 --html(各ページのリンクの部分) <ul> <li><a href="/service/#panel01">パネル1へ</a></li> <li><a href="/service/#panel02">パネル2へ</a></li> ・・・ </ul> --html(アコーディオンパネルの部分 /service/index.html ) <h5 class="trigger" id="panel01"><a href="#">パネル1のタイトル</a></h5> <div class="accblock"> <p>パネル1のコンテンツ</p> </div> <h5 class="trigger" id="panel02"><a href="#">パネル2のタイトル</a></h5> <div class="accblock"> <p>パネル2のコンテンツ</p> </div> (省略) ---js $(document).ready(function(){ $(".accblock").hide(); $("h5.trigger").click(function(){ $(this).toggleClass("active").next().slideToggle("slow"); }); }); location href か hash を使うのかなと思っているのですが うまく使いこなすことができませんでした。 アドバイスをいただけたら助かります。 どうぞよろしくお願いいたします。

  • リンクがうまくできません。

    リンクがうまくできません。 ホームページのテンプレートをダウンロードし、メモ帳で編集しているところです。 ダウンロードしたものの中にindex.html(トップページ)とpage1.html(リンク先)が入っています。 トップページにリンクを他にも作りたいので、page2,page3,・・とつくったのですが、 <UL id="menu"> <LI><A href="page1.html">about</A></LI> <LI><A href="page2.html">photo</A></LI> <LI><A href="page3.html">blog</A></LI> <LI><A href="page4.html">link</A></LI> <LI><A href="page5.html">mail</A></LI> </UL> こうした場合に、page1.htmlはちゃんとリンクできるのですが、それ以外のリンクが出来ません。 何か間違えているんでしょうか? それとも、他に何かしなくてはならないことがあるんでしょうか? 初歩的な質問かもしれませんが、よろしくお願いします。

  • リンクページがちゃんと画像表示されない

    PHP5.0、Smartyで開発しています(個人サイト) リンクを押すと、リンクページ(自サイト)は表示されるのですが、 画像などが表示されないことがあります。 .tplファイルなので、↓の同じリンクをいくつものファイルに書きましたが、ふつうにちゃんと表示されるページもあれば、リンクページの画像落ちといったページにもなります。 これはどうしてでしょうか? </div><!--header--> <ul id="menu"> <li><a href="{$info.back_url}">TOP</a></li> <li><a href="{$info.http_url}">記事一覧</a></li> <li><a href="{$info.http_url}/archive">過去ログ</a></li> <li><a href="{$info.http_url}/search">記事検索</a></li> <li><a href="{$info.http_url}/rss">RSS</a></li> <li><a href="{$info.https_url}/admin">管理者用</a></li> </ul> <img src="./image/main_img.jpg" alt="" width="760" height="340" id="main-img" />

    • ベストアンサー
    • PHP
  • 自社Webページ内の階層リンクへ飛ばない

    自社Webページ内の階層リンクへ飛ばなくなり困っています。 ドリームウィーバーでページを構築していますが、気づいたら同サイト内のリンクに飛ばなくなっていました。 <div id="menu"> <ul> <li><a href="#">トップページ</a></li> <li><a href="houjin.html">●●</a></li> <li><a href="tenpo.html">●●</a></li>     </ul> </div> div#menu ul { margin:0 auto; padding:10px 0; } div#menu li { font-size:85%;/* 12px相当 */ color:#2e2930; text-align:center; list-style-type:none; } div#menu li a { display:block; width:200px; color:#2e2930; line-height:60px; } /* マウスオーバー時 */ div#menu li a:hover { color:#f1f1f1; background:#2D2D2D url("img/bg_menu.gif") 0 0 repeat; } </li>が抜けていたので付け足しても変わりません。 他のページへのリンク(別窓で開く)は有効です。 考えられる原因を教えていただけると幸いです。 どうぞよろしくお願い致します。

    • ベストアンサー
    • CSS
  • フレームメニューでリンク先を展開して表示させる

    はじめて投稿します。よろしくお願いします。 フレームページで、左にメニュー、右にコンテンツです。 右コンテンツ内はtoggleで項目ごとに展開・折りたたみの設定をしており 初期値はdisplay:none;を指定しています。 左メニューのリンクをクリックすると、右コンテンツの該当箇所に移動して 中身を展開して表示させたいです。 <左メニュー(menu.html)> <ul> <li><a href="a.html#title1" target="right"></li> <li><a href="b.html#title2" target="right"></li> ・ ・ ・ </ul> <右コンテンツ(a.html)> <script> $(function(){ $("#list li div:nth-child(1)").addClass("title"); $("#list li div:nth-child(2)").addClass("content"); $(".title").click(function(){ $(this).next().toggle(300); }); }); </script> <ul id="list"> <li> <div id="title"> <p> <h4> <a name="title1"> タイトル1</a> </h4> </p> </div> <div id ="content" style="display:none;"> <p> あああああああああああああああああああああああ </p> </div> </li> </ul> javascriptなのかjqueryなのか、CSS3でもできるのか・・ なるべく簡単な方法がいいのですが 知識が乏しく、色々と試しましたが結果が出ずに悩んでいます。 アドバイスいただけないでしょうか。

  • HTMLのアンカーリンクについて。

    HTMLのアンカーリンクについて。 アンカーリンクですが、通常どおりリンクをはると、ブラウザ画面の一番上にぴったりくっついたかたちでリンクしてしまします。 たしか、リンク先の上の幅を指定できたと思うのですが、やり方を忘れてしました(^^;ゞ ちなみにHTMLはこんな感じです。 <div id="content">  <div id="anchor">   <ul>    <li><a href="post-1">投稿1</a></li>    <li><a href="post-2">投稿2</a></li>    <li><a href="post-3">投稿3</a></li>   </ul>  </div>  <div id="entry">   <h2 id="post-1">投稿1</h2>   <h2 id="post-2">投稿2</h2>   <h2 id="post-3">投稿3</h2>  </div> </div> すこし検索してみましたが見当たらなくて、質問させていただきました。 どなたか、おわかりの方ご教授いただけると助かります。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • javascript(DOM)でIDとテキストノードを取得する方法

    下記のことをDOMを使ってやりたいと思っているのですが、ちょっとできないので教えていただきたいです。 [HTML内での記述] <h2 id="apple">りんご</h2> <p>...</p> <h2 id="grape">ぶどう</h2> <p>...</p> <h2 id="orange">みかん</h2> <p>...</p> <h2 id="peach">もも</h2> <p>...</p> 上記HTMLから<h2>内のid名とテキストを取得して、下記のようなリストにしたいです。 (<p>...</p>の部分はどうでもよいです。) <ul> <li><a href="#apple">りんご</a></li> <li><a href="#grape">ぶどう</a></li> <li><a href="#orange">みかん</a></li> <li><a href="#peach">もも</a></li> </ul> 要するに、見出しを取得してページ内リンクを作りたいのです。 DOMで、getElementByIdとか使って、、と何となくは分かるのですが、完成させるまでには至っていません。 ご教授いただければと思います。

  • 複数トリガーで動作するアコーディオンメニュー

    お世話になります。 シングルページでページ内リンクでコンテンツ移動するタイプのページ作成を現在やっているのですが、急に標題の内容の要望が急ぎ対応として来まして、困っております。 具体的に言うと、 通常アコーディオンメニューは、 隠してある部分の見出しなんかをトリガーにして、開閉して内容を表示・非表示させると思いますが、今回要望としてあるのは、 グローバルナビもそのトリガーにしたいということです。 グローバルナビをクリックすると、該当箇所に移動しつつ、普段見出しだけで内容が隠してあるものも展開されるということができればと思っております。 参考までにコードを記載しておきます。 js部分 //accordion $('#sub01 h4').click(function() { $(this).toggleClass("open").next("div").slideToggle(); }).next().hide(); // drop down $("#nav li.drop").hover(function() { $(this).children('ul').show(); }, function() { $(this).children('ul').hide(); }); }); <div id="nav"> <ul class="clear"> <li><a href="#menu1">メニュー1</a></li> <li class="drop"><a href="#menu2">メニュー2<span>▼</span></a> <!-- InstanceBeginEditable name="planList" --> <ul> <li><a href="#sub01">サブ1</a></li> <li><a href="#sub02">サブ2</a></li> </ul> <!-- InstanceEndEditable --> </li> <li><a href="#menu3">メニュー3</a></li> <li><a href="#menu4">メニュー4</a></li> </ul> </div> ------省略-------------- <div id="sub01" class="subcontent"> <h4><span>項目名</small></span></h4> <div class="sub01Inner clear"> 内容内容内容</div><!-- /planInner --> </div><!-- /planBox -->

  • タグを切り替えるJavaScriptについて

    下記のurlを参考にして、タグを切り替えるJavaScriptを使いレイアウトをしています。 http://archiva.jp/web/javascript/tab-menu.html やりたいことは各内容をIDセレクタでくくりたいのです。 <div id="page1">  <h2>page1</h2>  <p>パンクズ</p>  <div class="nav">   <ul id="tab">    <li><a href="#page1"><span>page1を選択中</span></a></li>    <li><a href="#page2"><span>page2</span></a></li>    <li><a href="#page3"><span>pave3</span></a></li>   </ul>  </div>  <p>段落1</p> </div> <div id="page2">  <h2>page2</h2>  <p>パンクズ</p>  <div class="nav">   <ul id="tab2">    <li><a href="#page1"><span>page1</span></a></li>    <li><a href="#page2"><span>page2を選択中</span></a></li>    <li><a href="#page3"><span>pave3</span></a></li>   </ul>  </div>  <p>段落1</p> </div> ...page3 このようにやりたいのですが、JavaScriptがIDセレクタの"tab"にしか対応していないため、他のページにいくとクリックが効かなくなってしまいます。 idセレクタをclassセレクタに設定し直してもidセレクタにしか対応していないため効きません。 tag2とtab3に対応させるためにはどのようにすればいいでしょうか。 よろしくお願いします。

  • 一つのボタンでページ移動iframeとリンクを開く

    divで分けたpage1とpage2で page1には <ul > <li><a href="http://www.apple.com/jp/"target="iframe1" >Apple</a></li> <li><a href="http://www.microsoft.com/japan/‎" target="iframe1">Microsoft</a></li> </ul> page2には <iframe name="iframe1"></iframe> page1の外部リンクをクリックした時に page2移動して、iframe内にHPを開く用にしたいのですが、できますか!? targetでpage2にリンクを開くのはできましたが ページの移動ができません。 例えば、javascriptでpage1の外部リンクは全て移動するとか。。。 ど素人なので、違う簡単な方法があれば教えてください。