• 締切済み

別ページの指定した座標(x.y)へリンクしたい

はじめまして http://okwave.jp/qa/q751783.html で、既に質問されている方とほぼ同じ内容の質問です。 上記質問では一見解決がなされておらず、参考にしたくとも当方でも結局出来ませんでした。 よって、改めて、私の問題点を率直に質問をさせて頂こうと思います。 http://freeeeeze.web.fc2.com/scrollin/scroll.html 上記URL、こちらに、つたないながらうまく行かないで困っているhtmlを置いてあります。 要は、パララックスに興味を持ち「skrollr-master」を素に作り始めましたが ページ内のリンクは「<a onclick="window.scroll(0,1000);" />●●</a>」で解決したのですが、リンクした別ページのページ途中(例えばスクロール量4000の座標)への設定がどうしてもできません。 <SCRIPT language="JavaScript"> <!-- function OpenWin1(){ win=window.open("link01.html","_top"); win.scroll(0,500); } // --> <!-- function OpenWin2(){ win=window.open("link01.html","_top"); win.scroll(0,4000); } // --> <!-- function OpenWin3(){ win=window.open("link02.html","_top"); win.scroll(0,500); } // --> <!-- function OpenWin4(){ win=window.open("link02.html","_top"); win.scroll(0,4000); } // --> </SCRIPT> http://okwave.jp/qa/q751783.htmlで紹介されている内容が使えるかなと思い 上の様なものを真似て書き、 <a href="javascript:OpenWin1()">●●</a> からリンクをとやってみたのですが、うまく行きません。 見よう見まね、パクったり、繋ぎ合わせたり、素人がちょっと無理な事に首を突っ込んで いる感じなのですが、 ペラ1のパララックスを作ってみるという、課題をなんとかクリアしたく、 どうか、お知恵ある方々にアドバイス頂ければと思い質問させて頂く事にしました。 何となく、htmlやcssやjavascriptを使っているレベルです。 今回「bootstrap」も使ってスマホ対応という課題も課してやってみています。 いろいろ、理解をしてやっているのではないので ご面倒かと思いますが、できるだけ噛み砕いてご教示頂けると助かります。 もちろん、htmlを書き直して頂いて示して頂けるに越した事はありません。 何卒、どうか宜しくお願い致します。

みんなの回答

  • mpro-gram
  • ベストアンサー率74% (170/228)
回答No.3

scroll.html のページ内に インラインフレームを置いて、インラインフレーム内には「link01」や「link02」のどちらかを表示するんですよ。 前回示したhtml 記述を全部scroll.html内に記述してみてください。

freeeeeze
質問者

お礼

mpro-gram 様 誠にありがとうございました。 いろいろやってみたのですが、 どはまりしてしまいました。 インラインフレームを設置してみましたが 私のやり方がおかしいのか、 インラインフレームの中のスクロールがおかしなことになり 見直しているうちに更におかしくなってしまいました。 一旦、落ち着いてから まったく別な方法を試したところ 意外とすんなりうまくいってしまいました。 ページを遷移させてから、スクロールの動きを指示する スクリプトを設置する方法をいろいろ探した結果 それがはまりました。 いろいろアドバイス頂いたのに 私の知識不足、理解不足でご提案を活かせなかったことを お詫びするとともに大切なお時間を割いてお答え頂いたことに御礼申し上げます。 また、落ち着いたらインラインフレームとスクロールの関係についてやり直してみたいと思っています。 ありがとうございました。

  • mpro-gram
  • ベストアンサー率74% (170/228)
回答No.2

相手先ページが同じなら、iframe 内に読むことにしたとして、以下のようなjavascript linkをおいて、先にiframeにページを読んでおくと直ぐ飛べる <a href="javascript:window.frames['inline_frame'].scroll(0,1000);">y 1000</a> <a href="javascript:window.frames['inline_frame'].scroll(0,4000);">y 4000</a> <iframe src="list01.html" name="inline_frame" width="600" height="500"></iframe> ページ読替用は、さらに別にリンクを置いておく、こっちは通常リンクにtarget 指定のみ <a href="list02.html" target="inline_frame">list02.html</a> ページを読み替えても、iframeに対してscroll動作が行われるので、上記scriptも動く 要は、ロードとスクロールを切り離してしまうのがもっとも簡単。

freeeeeze
質問者

お礼

回答、ありがとうございます。 素人の質問にお付合い頂き大変恐縮しております。 「onload を待たせる方法」を探してみてもちょっと見つからず困っていたので助かります。 是非、ご回答の内容で進めてみたいと思うのですが、 http://freeeeeze.web.fc2.com/scrollin/scroll.html ページを全部(あるいは表示したい範囲を) iframe で囲って「scroll.html」の内容も「link01」も「link02」も iframe 内に表示してしまうということでしょうか? なんだか、間違った解釈しているようで不安なんですが、 ちょっと、やってみようと思います。 誤解釈があるようでしたら、大変恐縮ですがご指摘いただけると幸いです。

  • mpro-gram
  • ベストアンサー率74% (170/228)
回答No.1

> win=window.open("link02.html","_top"); target _top ということは、現在window のページが切り替わってしまいますので、元のページのJavascript は消去されて存在しませんので、無理です。 別のframe か window、または iframe などへ開くなら、元ページが残るのでなんとか、それでも、すぐに実行しようとしてもページロード前では、scroll出来ないので、onload を待って実行させるような工夫が必要。

freeeeeze
質問者

お礼

回答、誠にありがとうございます。 target _top でやろうとする限り、このやり方は間違ったアプローチだったと いうことですね。 ページが切り替わるとJavascript は消去されるというのは、Javascript をよく解っていない事を露呈してしまってますね。 大変勉強になりました。ありがとうございます。 ただ、まだ、この状態からでも工夫次第でなんとかなるとのこと。 複雑過ぎると付いて行けなくなるかも知れませんが、 是非とも実行させたいと思っています。 「onload 」を待たせる方法探してみますが。 もし、良い方法、思いつかれる様でしたら、是非お教え頂きたいと 思っております。 宜しくお願い致します。

関連するQ&A

  • 別ページの指定した座標へリンクしたい

    こんにちは。 以前 http://oshiete1.goo.ne.jp/kotaeru.php3?q=725989 で現在表示中の指定した座標へリンクする方法で <A href="javaScript:scroll(x,y)">●●</a> を教えて頂きました。 これを応用して別ページの指定した座標へリンク できるようにしたいと思い、 <A href="javaScript:index.asp#scroll(x,y)">●●</a> と指定を変えてみたのですが、うまくいきません。 別ページはaspなのですが、別ページへは座標指定で リンクはできないのでしょうか? どなたかご存知の方は教えて下さい。 よろしくお願いします。

  • 複数の画像をリンク設定し、サイズ、位置を指定してそれぞれ別ページにリンク設定する場合

    ホームページを作成している最中です。 画像をクリックした際に、リンク先はリンク元の拡大画像を表示し 画像サイズと位置を指定するよう設定しています。 例えば、そのリンク元の1ページに縮小画像が複数有る場合、 どのように記述すればよいのでしょうか。 現在はこんな感じとなっています。 -=-=-=-=-=-=-=-=-=-= <SCRIPT language="JavaScript"> <!-- function openwin() { window.open("http://●●●.net/guide_a.html", "", "scrollbars=yes,width=420,height=270,top=100,left=80,scrollbars=no"); } //--> </SCRIPT> -=-=-=-=-=-=-=-=-=-= 省略 -=-=-=-=-=-=-=-=-=-= <TD><A href="javascript:openwin();"><IMG src="image27.jpg" width="150" height="94" border="0"></A></TD> ↑この画像をクリックすると、上記で指定したサイズ、位置で画像が表示されますが 同じページにリンク元が複数ある場合、どのように記述すればよいでしょうか。 例えば、下記の別の画像も同じように、違うページに設定したいです。 <TD><A href="javascript:openwin();"><IMG src="image17.jpg" width="150" height="94" border="0"></A></TD> リンクしたいページ http://●●●.net/guide_b.html 今の状態ですと、リンク元の画像は同じページ内にあるため image17もimage27も同じリンク先(http://●●●.net/guide_a.html)に飛んでしまいます。 これをそれぞれ別ページにリンク設定したいです。 image27→http://●●●.net/guide_a.html image17→http://●●●.net/guide_b.html 大変わかりずらい説明で申し訳ありません。 素人なのでいまいち説明の仕方がよくわかってないです。。。 どうぞよろしくお願いいたします。

  • onunLoadを指定ページでだけ除外する方法

    お世話になります。 自分のブログを閉じた際に、javascriptのonunloadを使って 別のウィンドウが開くようにしたのですが、 閉じた時以外にも、ブログ内のリンクをクリックして 別のページに飛んだ際にまで窓が開いてしまいます。 ブログ内のリンクを踏んだ際は、スクリプトが作動しないようにするには、 どうすればよいでしょうか? (ちなみに当方javascriptは素人です;) ちなみに自分の使ったのは、 <SCRIPT LANGUAGE=JavaScript TYPE=text/javascript> var Path = 1; function OpenWindow(url) { if(Path == 1){ OpenWin=window.open(url,"PopUp","toolbar=0,location=0,status=0,menubar=0,scrollbars=0,resizable=0,wi dth=1150,height=780"); OpenWin.blur(); window.focus(); } } </SCRIPT> And in the body tag: <body onunload="OpenWindow('http://www.新たに開くページ.html')"> よろしくお願い致します。

  • java scriptによるポップアップウインドウについて

    <head> <SCRIPT language="JavaScript"> <!-- function OpenWin1(){ win=window.open("window1.html","new","width=300,height=100"); } // --> <!-- function OpenWin2(){ win=window.open("window2.html","new","width=500,height=200"); } // --> </SCRIPT> </head> <body bgcolor="#FFFFFF" text="#000000"> <A href="javascript:OpenWin1()">1.ウィンドウを開く</A> <A href="javascript:OpenWin2()">2.ウィンドウを開く</A> </body> 「1.ウィンドウを開く」をクリックしてwindow1.htmlのポップアップウインドウを表示させたまま、「2.ウィンドウを開く」をクリックすると、最初のウインドウサイズを保持したまま、新しいウインドウが開いてしまうのですが、これをうまく処理する方法はないのでしょうか? どなたかアドバイス頂けると嬉しいです。 よろしくお願い致します。

  • リンクで別ウインドウを立ち上げる場合

    時間がなくて、ものすごい困っているので教えてください。 JavaScriptでテキストリンク部分から別ウインドウを立ち上げたいのですが、 <!-- function openWin() { window.open("sub.html","sub","width=320,height=240"); } // --> これだと一つのリンクと一つのウインドウにということになりますよね。 4つそういったリンクさせる場所が存在し、さらに同じサイズのウインドウを立ち上げたいのですが、4つを列記する場合はどうすればよいのでしょうか。javascript初心者なのでどうしてもわかりません。ご存じの方がいらっしゃいましたら、教えてください!

  • javascriptでのポップアップウィンドウが開かなくて困っています><

    初歩的な質問ですいません。 <script language="JavaScript"> <!-- function OpenWin(){ win=window.open("sample.html","new","width=100,height=100"); } //--> </script> <a href="javascript:OpenWin()"><img src="img/1.jpg" width="60" height="60" onClick="MM_openBrWindow('sample.html','sample','scrollbars=yes,width=460,height=460')" border="0"></a> 上のスクリプトで下のリンクで開こうとする時に、 どうしても開けません。>< どうしてなのでしょうか!? どこかが間違えているのでしょうか!? 誰か助けていただけませんでしょうか;><;;

  • JavaScriptのwindow.openでリファラーが取得できない。

    <SCRIPT language="JavaScript"> <!-- function OpenWin(){ window.open("sample.cgi,"new","width=500,height=250"); } // --> <A href="#" onClick="OpenWin()">オープン</a> 上のようにsample.htmlのページ内にwindow.openのJavaScriptを書いています。 sample.cgi内に$ENV{'HTTP_REFERER'}を埋め込んでいるのですがリファラーが取得できません。 window.openの場合はリファラーは取得できないのでしょうか?

    • ベストアンサー
    • CGI
  • FLASHで別ウィンドウを指定した大きさで開きたい

    以前にも同じ質問した事があるのですが、大きさは変えられたものの、スクロールバーなどをなくしてすっきりと表示したいのです。 QNo.321616がわかりやすくて早速参考にしてみたのですが、動かしてみたら、ツールバーなどを表示しない指定をしたにもかかわらず、表示されたままです。 ちなみに、QNo.321616の回答通り、 HTMLファイルに <script Language="JavaScript"><!-- function openWin(url) { window.open(url,"popup","toolbar=no,location=no,scrollbars=no,width=200,height=200"); } // --></script> と書いて、 Flashボタンの方に、 on (press) { getURL("javascript:openWin('ai.html');"); } と書きました。Flashボタンの方に飛ばす(固定したい)リンク先(ai.html)を入れただけなのですが、何か問題があるでしょうか。

  • ウィンドウオープンに関する初歩的質問ですが

    ウィンドウオープンに関する初歩的質問ですが html側で <a href="javascript:OpenWin('new.html',100,100)">ウィンドウオープン</a> と記述して javascript側で function OpenWin(url,Width,Height){ win=window.open(url,"new","width=Width,height=Height,resizable=1,scrollbars=1"); } と記述してあります。 javascript:OpenWin('new.html',100,100)の部分を javascript:OpenWin('new.html',300,500)としてリンクをクリックしてもウィンドウの大きさが変化しません。 文法上どこか間違っていますでしょうか? よろしくご教授承りたく存じます。

  • サブフレームがうまく出来ません。

    ジャバでサブフレームを開くようにしたいのですが・・1つならちゃんと開くのですが複数になると、開くことは開くのですがみんなおんなじページが開いてしまいます。 1つ1つ違ったページをサブフレームで開きたいのですがどうすればいいでしょうか? お暇な時でかまいませんので教えて頂けると助かります。 <SCRIPT LANGUAGE="JavaScript"> <!-- function openwin() { window.open("jiten/kougouki.html","sub1","screenX=20,screenY=20,left=20,top20,width=300,height=300"); } // --> </SCRIPT> <a href="javascript:openwin()"><b>○○○○</b></a><font color="#0066cc"></font><BR> <BR></P><FORM> ↑これを開きたいページごとにいくつも書いたのですが先に説明した状態になってしまいます。

専門家に質問してみよう