• 締切済み

Aタグがスクロールしないと有効にならない

メニューページから内容のページにnameを使ってリンクさせているのですが、 開かれたページの指定されたname部分に飛ばず、普通にページが開いてしまいます。 しかもこの内容のページの一番上部にはメニューページに戻るリンクもあるのですが、それも全く反応ナシで カーソルを合わせてもカーソルが変わらずクリックしても無反応です。 それなのに何故かその内容ページのスクロールバーに触れると突然nameもメニューに戻るリンクも正常になります。 これは何が原因なのでしょうか? ページ自体が重いので読み込みに時間がかかるのかとも思ったのですが ページ全体で15k程度で画像は使っていません。 CSSを多用しています。 Aタグと相性の悪いタグやCSSがあったりするのでしょうか? 色々CSSを外してみたりもしたのですが直りません。 どうかお知恵をお貸しください(T-T)

  • HTML
  • 回答数2
  • ありがとう数1

みんなの回答

  • s_hukami
  • ベストアンサー率66% (98/148)
回答No.2

色々試してみましたが、おっしゃる症状がどのような記述でなるのか判りませんでした。 申し訳ありませんが、せめてOS、ブラウザなどの使用環境や、HTMLとCSSのソースを書いてくださらないと、回答のしようがありません。 また、CSSやHTMLに記述ミスはないでしょうか? ちなみに私が試しに書いたソースの一例を以下に記述します。とりあえずWin XPでIE6/Opera7.53/NN 7.01で閲覧可能です。 ============================================= サンプルソース --------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>Sample Site</title> <style type="text/css"> body{ background-color:#ccffff; } h1{ color: #21536a; } h2{ border-bottom: #0066ff 1px solid; border-left: #0066ff 10px solid; padding-left:10px; } /* メニュー設定 */ #menu{ float: left; margin-left:20px; width: 160px; background-color: #ffffff; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; font: small Verdana,sans-serif; } #menu a:link, #menu a:visited { display: block; width:140px; border-top: 1px solid #ffffff; border-bottom: 1px solid #cccccc; font-weight: bold; padding: 3px 10px; color: #21536a; } #menu a:hover{ border-top: 1px solid #cccccc; background-color: #ddeeff; font-weight: bold; text-decoration: none; } #content{ float: right; width: 560px; height: auto; margin-right: 20px; margin-left: 20px; background-color: #ffffff; padding: 10px; color: #333366; line-height: 160%; } #content a:link, #content a:visited { color: #0033ff; font-weight: bold; } #content a:hover{ background-color: #0033ff; color: #ffffff; font-weight: bold; } </style> </head> <body><a name="head"></a> <h1>Site Title</h1> <div id="menu"> <a href="#menu01">Menu01</a> <a href="#menu02">Menu02</a> <a href="#menu03">Menu03</a> <a href="#menu04">Menu04</a> <a href="#menu05">Menu05</a> </div> <div id="content"> <h2><a name="menu01">Menu01</a></h2> <p>Sample Contents01<br> Sample Contents01<br> Sample Contents01 </p> <p><a href="#head">UP</a></p> <h2><a name="menu02">Menu02</a></h2> <p>Sample Contents02<br> Sample Contents02<br> Sample Contents02 </p> <p><a href="#head">UP</a></p> <h2><a name="menu03">Menu03</a></h2> <p>Sample Contents03<br> Sample Contents03<br> Sample Contents03 </p> <p><a href="#head">UP</a></p> <h2><a name="menu04">Menu04</a></h2> <p>Sample Contents04<br> Sample Contents04<br> Sample Contents04 </p> <p><a href="#head">UP</a></p> <h2><a name="menu05">Menu05</a></h2> <p>Sample Contents05<br> Sample Contents05<br> Sample Contents05 </p> <p><a href="#head">UP</a></p> </div> </body> </html>

  • equation
  • ベストアンサー率38% (10/26)
回答No.1

何かcss実装のバグっぽい気がしますが。 ご自分で調べるのであれば 【CSSバグリスト@CSSバグ辞典スレッド】 http://cssbug.at.infoseek.co.jp/ をどうぞ

参考URL:
http://cssbug.at.infoseek.co.jp/

関連するQ&A

  • スクロールのタグ

    モバイルでAUの公式サイトで一番下までスクロールするとページの上部に戻ります。 同じ事をhtmlで実現可能でしょうか。 スクロールのタグなんて存在していますか? 宜しくお願いします。

    • ベストアンサー
    • HTML
  • 携帯HPで、最下部⇔最上部移動のHTMLタグを知りませんか?

    携帯HPをHTMLタグで制作しているのですが… 【iメニュー】や【EZweb】みたいに 上下スクロールで最下部⇔最上部移動をさせたいのです。 現在はアクセスキーリンク <A NAME=0></A> <A HREF=#0 ACCESSKEY=0>▲</A> <A NAME=9></A> <A HREF=#9 ACCESSKEY=9>▼</A> で対応しています。 が、 上下ボタンでスクロールさせていくと、 自動的に最上部or最下部に移動できるのはチョット気になっています。 ご存知の方、教えて下さい。 m(_ _)m もしかして、タグではなく別の方法?

    • ベストアンサー
    • HTML
  • フレームで同一ページにリンクさせるタグ

    こんばんは、よく長くスクロールしてるページは 同一内でリンクさせると便利と聞いたんですが それってフレームページでもできますか? 下のように左にメニューがあって、右にメインのコンテンツを置いたとフレームページがあるとして メニュー      メイン 1         1 2         2 3         3 メニューの1からメインの1へ、メニューの2からメインの2への 同じく3と続いた場合、リンクの貼り方のタグはどのようになるでしょう? なるべくどのブラウザで見ても大丈夫なようにしたいのですが。 特にwinとmac両方でもいけるタグってありますでしょうか。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • x軸にはスクロールしない、ページ内リンクをスムーズにスクロールするスク

    x軸にはスクロールしない、ページ内リンクをスムーズにスクロールするスクリプトを探しています。 こだわりのページ内リンクスムーズスクロール scrollsmoothly.js http://d.hatena.ne.jp/KAZUMiX/20080418/scrollsmoothly などを色々試しまして、同ページ内のリンクはきれいに動くのを確認しました。 サイトはグローバルメニューが左にあり、横幅が広めのデザインです。 問題は、小さい画面閲覧する際、別ページからページ下部のアンカーへ飛んだ場合です。 一旦ページの最上部左に移動してからアンカーへスクロールするため、 斜め下方向へスクロールし、そこからページの先頭へ戻る場合斜め上にスクロールする 動きになります。 クライアントから動きが気持ち悪いというクレームがあったので、 x軸にはスクロールしない方法を探したのですがなかなかうまくいきません。 jQueryのサンプルなど有りましたら教えてください。

  • 十字キーが出てきてページがスクロールできません。

    調べてみたのですがなにが原因かよくわかりません。 ホームページで、縦2分割フレームを使っています。 左はメニュー。右にリンク先のページが表示される形になります。 そこで、右のページを日記に設定したのですが、 (INDEXから飛ぶと左にメニュー、右に日記が表示できるように) 日記は表示されますがマウスキーが十字キーに変化し、 ページをスクロールさせることができません。スクロールバーも無反応です。 フレームの境界線には(右側に)斜線のような線がでます。 レンタル日記、Pixivのブログどちらも同じような状況に陥ります。 ページを開いて自然に右側をスクロールできるようにするにはどうすればよいでしょうか。 特に目立ったタグはありませんでした。FC2をつかっております。 ご指導をお願いいたします!よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • tableタグによるエラー

    モバイルサイトの制作の際に tableタグを使用した箇所で ページスクロールをすると 意図しない場所に飛ぶことがあります。 例えばページ下部にtableタグを記述し 実機で最下部から上部へ ページスクロールするとtableタグの箇所で 最上部に飛んでしまうことがありました。 記述ミスではなくtableタグを使わないと 直りました。 モバイルサイトの制作の際、 複雑なレイアウトにする場合、tableタグが必要になります。 これはどのようなことが原因なのでしょうか。

  • スクロールバーのタグについて

    こんにちは。 先日、HPができたのですが スクロールバーがうまくいかずに困っています。 HPの中でイラストを表示させるページがあり、 <a href="画像URL"target="a"></a> そのタグを上のようにしています。 HP内全てのページのスクロールバーを <style type="text/css"> <!-- body{ scrollbar-face-color:白; scrollbar-arrow-color:オレンジ; scrollbar-track-color:黄緑; scrollbar-highlight-color:赤; scrollbar-shadow-color:水色; scrollbar-3dlight-color:黒; scrollbar-darkshadow-color:ピンク; } --> </style> 上のように設定しています。 (色はわざとコードを使わないで名称で書いてます。) 他のページには全て反映できているのですが、 そのイラストを表示させるページの スクロールバーは何も変化がありません。 画像をアップするのにFFFTPを使っていて、 FFFTPから右クリックで 「URLをクリップボードへコピー」で 画像のURLのところに貼り付けています。 なので、そのページのタグは画像のみで スクロールバーの設定をしていないからだろうと思うのですが、 よくわからくて、困っています。 うまく説明ができませんが、 アドバイス等ありましたら、お願いします...! 説明不足の質問などでもどうぞ... よろしくお願いします。

  • スクロールバーを無くしたい

    フレームを使うとき、スクロールバーの有無を <FRAME Src="***.html" Name="menu" Scrolling="no"> のようなタグで決めるのは調べてわかったのですが、 フレームを使用せず、普通の一つのhtml文書でスクロールバーを非表示にする方法はありますか?

    • ベストアンサー
    • HTML
  • カーソルが画面端に来たとき横スクロールするhtml

    ページ全体に画像を貼り、カーソルが画面の左右数センチに来たときに横にゆっくりスクロールされていくhtml(又はcss、スクリプト)を教えて下さい。 絵巻物を見るような感覚のページを作りたいと考えています。 また、その画像の上に、背景の上に付けるようにリンクを何箇所か乗せることは可能でしょうか? 可能でしたら、その方法も是非お聞きしたいです。 複雑な上に説明がわかりづらくて申し訳ありません。

    • ベストアンサー
    • HTML
  • ホームページ表示の際に一番上までスクロールされる

    CMS(drupal6.24)を使用してサイトを制作しているのですが、いつの頃からかページ内のリンクをクリックしてリンク先のページを読み込むまでの間に下の方にスクロールしていると、ページが完全に読み込まれた瞬間にガクッと一番上までスクロールが戻ってしまうようになりました。 例えば、リンクをクリックしてリンク先のページで真ん中あたりまでスクロールしておくと、ページの読み込みが完了したタイミングでスクロールバーが一番上まで戻ってしまうのです。 サイトを作り始めた頃はこんなことはなかったのですが、いつの間にかこのような状態になっていたため、何が要因となっているかもわかりません。 読み込みが完了してもスクロールしていた分は戻らないようにしたいのですが、やり方がわからず困っています。 どうかご助言よろしくお願いいたします。

    • ベストアンサー
    • HTML