リンクで違うページの指定箇所へ飛ばそうとしています。

リンクで違うページの指定箇所へ飛ばそうとしています。

IEやsafariでは問題なく指定箇所に飛ぶのですが、
Firefoxだと何故か指定箇所ではなく、そのページの一番下に飛んでいきます。

IEは6、7、8
safariは4.0.2で、
Firefoxは3.6.6を使用しています。

Firefoxのバグなのでしょうか？
(同じページ内の指定箇所だとちゃんと飛びます)

急ぎの為大変困っております。
ご回答お願い致します。



HTML--------------------------------------------------------------

<a href="http://～～～/●●.html#abc" />


飛ばしたい場所

<div id="abc">
<img src="画像URL" border="0" alt="" />
</div>

No.8 回答者： 9000033 回答日時： 2013/05/03 17:46

私も、同じような事にぶつかりました。

Firefoxのみの現象で、

<a href="#aaa">コンテンツへ</a>

<div id="aaa">コンテンツ内容・・・</div>

ページ内リンク（HTML5）の際にページの一番下へ移動してしまう現象がありました。

私の場合原因は、Jqueryプラグインでした。

原因のプラグインをこちらを、
ヘッダーに読み込んでいたところを
ページの下</body>前に変更すると解決できましたよー

なせばなる♪

No.7 回答者： kuzumiHK 回答日時： 2010/08/10 21:10

＞赤い線は指定した場所よりもだいぶ下の方に、四角形の形で出てきました。

それでは、Firefoxでその赤い枠の付近をテキスト選択して、
右クリックで「選択した部分のソースを表示」を選択してみてください。

そのソースの周辺に「abc」らしき文字列がありませんでしょうか。
もしありましたら、その文字を変更するか、
アンカーのほうを、かぶらないようなidに変更する必要があります。

No.6 回答者： kuzumiHK 回答日時： 2010/08/06 00:02

スタイルがおかしな位置に移動させている可能性がありそうですね。

では、↓をbody内に追加するとどんな数値が出てくるでしょうか。

<script type="text/javascript">
var element = document.getElementById("abc");
alert("上" + element.offsetTop + "px、左" + element.offsetLeft + "px");
</script>

また、下記のスタイルを追加すると赤いボーダーはどこに出ますでしょうか。

<style type="text/css">
<!--
*{
border-top:1px solid #090 !important;
border-bottom:1px solid #039 !important;
}

#abc{
clear:both !important;
float:none !important;
display:block !important;
visibility:visible !important;
overflow:visible !important;
position:static !important;
margin:100px !important;
padding:100px !important;
width:200px !important;
border:6px solid #f00 !important;
z-index:9999 !important;
clip:auto !important;
text-indent:0 !important;
}

#abc *{
float:none !important;
display:block !important;
}
-->
</style>

この回答へのお礼

ご回答いただきありがとうございます。

赤い線は指定した場所よりもだいぶ下の方に、四角形の形で出てきました。
リンクはその赤い線の一番上（四角形の上辺）に飛んでいきます。

<script type="text/javascript">
var element = document.getElementById("abc");
alert("上" + element.offsetTop + "px、左" + element.offsetLeft + "px");
</script>

こちらを入れても数値？というのがでてきませんでした・・・
知識不足で申し訳ありません。

どうかアドバイスをお願い致します。

お礼日時：2010/08/10 11:10

No.5 回答者： kuzumiHK 回答日時： 2010/07/17 13:33

idやnameに他でabcを使っている可能性はありませんでしょうか。

また、ページ内に、

<style type="text/css">
<!--
#abc{
border-top:1px solid #f00;
}
-->
</style>

を追加した場合、ボーダーはどの位置に出るでしょうか。

この回答へのお礼

ご回答頂きありがとうございます。

結果、どこにもでませんでした・・・

本当に全く関係のない文字に変更したところ、
飛ぶリンクと飛ばないリンクがでてきました。

しかし飛ぶほうも、一度ページの下までいき、
すぐに上の指定場所まで飛んでいくといった、よくわからない状態になりました。

指定場所に飛ばない方は、相変わらずページの下に飛ぶだけです。


何か解決策はございますでしょうか・・・

お礼日時：2010/08/05 13:25

No.4 回答者： kernel_kaz 回答日時： 2010/07/16 15:03

>idからnameにかえてみたのですが

<div id="abc"> を <div name="abc"> に変えたの？
そうじゃなくて <a name="abc"> に変えても駄目？

この回答へのお礼

ご回答頂きありがとうございます。

<a name="abc">◎○</a>でしました。
ですが何故か飛んでくれません・・・

同ページ内だと問題ないのですが・・・

お礼日時：2010/07/16 16:00

No.3 回答者： yyr446 回答日時： 2010/07/16 14:49

まだ解決されてませんが、同様の質問が7/13にも出てます。

http://oshiete.goo.ne.jp/qa/6035408.html

<a name="... でも　<div id="... も外部ファイルからアンカーのハッシュ
で移動しますけどねえ（Firefoxでも）

DOCタイプによる違いかなああ、ちょっとだけ調べてみよう。

この回答への補足

度々すみません。
もしわかりましたら、教えていただけると助かります・・・！

補足日時：2010/07/16 16:07

この回答へのお礼

ご回答頂きありがとうございます。


URL有り難うございます。
参考にさせて頂きます！

お礼日時：2010/07/16 16:04

No.2 回答者： kernel_kaz 回答日時： 2010/07/16 10:46

アンカー目的なら、<div id="abc">じゃなくて、<a name="abc">じゃ無いのかな？

<div id="abc">でもアンカー認識するかも知らんけど、それはブラウザの独自仕様じゃなかったっけ？
HTMLの基本で書いたら？

この回答へのお礼

ご回答頂きありがとうございます。

idからnameにかえてみたのですが、それでもページの下に飛ばされてしまいます。

他に何か解決策がありましたら、宜しくお願い致します・・・。

お礼日時：2010/07/16 11:31

No.1 回答者： aokii 回答日時： 2010/07/16 10:30

IE

safari
Firefoxに互換性はありません。

この回答へのお礼

ご回答頂きありがとうございます。
互換性はないんですね。


何かhtmlで解決策がありましたら、ご回答頂けると助かります・・・！

お礼日時：2010/07/16 11:32