締切済み

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

2004/10/04 21:18

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

Riruka
お礼率39% (83/209)

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

みんなの回答 （2）
専門家の回答

みんなの回答

s_hukami
ベストアンサー率66% (98/148)

2004/10/13 21:58 回答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>