人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

HTMLページtest.htm内に

<a name="j1">1</a>
<a name="j2">2</a>
<a name="j3">3</a>
のようにアンカーポイントを入れ、
<a href="test.htm#j1">1にジャンプ</a>
<a href="test.htm#j2">2にジャンプ</a>
<a href="test.htm#j3">3にジャンプ</a>

とページ内でリンクをさせた場合、FireFoxで閲覧すると、長いページであってもクリックでジャンプできません。
IEならちゃんとジャンプできます。
test.htmを書かなかった場合も同様です。

このような現象の原因と対策をお教えください。IEでもFireFoxでも正しくジャンプさせたいのです。
(“過去の質問から検索”ではこの現象について見つけることができませんでした。FAQでしたらご容赦ください。)


●質問者: mouitchou
●カテゴリ:ウェブ制作
✍キーワード:firefox test アンカー クリック ジャンプ
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● haruo-31
●30ポイント

うちのFirefox3では↓のソースが問題なく動きました。

一度HTMLバリデータを使ってみてはいかがでしょう。

http://validator.w3.org/

<html>

<head>

<title>ababababa</title>

</head>

<body>

<a name="a1">テスト</a>

<div style="height: 300px;">&nbsp;</div>

<a name="a2">テスト2</a>

<div style="height: 300px;">&nbsp;</div>

<a name="a3">テスト3</a>

<div style="height: 300px;">&nbsp;</div>

<a href="#a1">りんく</a>

<a href="#a2">りんく</a>

<a href="#a3">りんく</a>

</body>

</html>

◎質問者からの返答

有り難うございます。

確かにエラーがたくさん検出されました。ただ、これだけ出ると、どこまでが本件に関するものか……。調べてみます。


2 ● stripafe
●30ポイント

本来 Firefox でも問題なく動作するはずです。

IE ならちゃんと動くとのことですが、エラーがあっても動いてしまうだけかもしれないので、意図した通りに動いたからといってそちらが正しいとは限らないのが面倒なところですね。


必要最小限のタグと質問内の記述だけに内容を制限したファイルを作ってテストしてみると、問題箇所が発見しやすくなるのではないでしょうか。

もしそのテストファイルでは意図した通りに動くのに元の test.htm でうまくいかないようだったら、質問箇所以外のどこかにエラーがあって、そのせいでうまくジャンプ出来なくなってしまったのかもしれません。

http://validator.w3.org/


たとえば name の代わりに id で試してみるのはどうでしょう。

test.htm を書いても書かなくても動作しないということは、拡張子が一致していないということはなさそうですね。


他のブラウザや、別バージョンでも動きませんか?

その Firefox 固有の問題だったら、自分ならとりあえずブラウザを再起動してみる、初期設定ファイルを破棄してみる、アンインストールしてインストールし直してみるなどを、おまじないのように片っ端からためしてみます。

◎質問者からの返答

有り難うございました。たしかにidでジャンプできました。


3 ● pahoo
●40ポイント ベストアンサー

ご質問のようなアンカーは、手元のFireFox(Windows版3.0)では正常に動作しました。


ただ、アンカーを含む要素に name もしくは id 属性を付けているとすると、ご質問のような不具合が発生するかもしれません。これはFireFoxの仕様です。

回避策は「Netscape / Firefox でのページ内ジャンプ動作」を参考にしてください。

◎質問者からの返答

当方のFireFoxはWindows版3.01です。

ご紹介いただいた回避策が大当たりでした。name=に加えてid=を並べることで解決しました。それも、一番上のアンカーひとつだけに付けるだけでちゃんと動作します。FireFoxのバグか不具合ということで理解し、以後は両方のタグを併記することにします。

どうも有り難うございました。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ