※ ChatGPTを利用し、要約された質問です(原文:jQueryでドロップダウンメニューができない)
jQueryでドロップダウンメニューがうまく表示されない
このQ&Aのポイント
参考書をみながらjQueryを使用してドロップダウンメニューの実装を試みていますが、うまくいきません。
ドロップダウンメニューが表示されない原因を調査中ですが、解決策が見つかりません。
質問者は締切が迫っており、焦っています。ご助言いただけると助かります。
jQueryの参考書をみながらドロップダウンメニューを実装しようとしたのですが
うまくいきません。
締切が迫って焦っております。
<ul class="main">
<li><a href="index.html">メインA</a></li>
<li><a href="concept.html">メインA</a></li>
<li><a href="service.html">メインA</a>
<ul class="sub">
<li><a href="">サブ1</a></li>
<li><a href="">サブ2</a></li>
<li><a href="">サブ3</a></li>
<li><a href="">サブ4</a></li>
<li><a href="">サブ5</a></li>
</ul>
</li>
<li><a href="faq.html">メインA</a></li>
<li><a href="access.html">メインA</a></li>
</ul>
cssは
.main {
clear:both;
width:830px;
height:42px;
margin:0 auto;
list-style-type:none;
}
ul .main li {
width:166px;
height:42px;
float:left;
position:relative;
background:url(../../img/index/btn.png);
}
.main li a {
display:block;
width:100%;
height:100%;
padding:10px 0 0 40px;
font-size:14px;
font-weight:bold;
color:#333333;
text-decoration:none;
line-height:1.5em;
}
ul .sub{
display:none;
}
scriptは
<script type="text/javascript">
$(function(){
$("ul.main li").hover(function(){
$(">ul:not(:animated)",this).slideDown("fast");
},
function(){
$(">ul",this).slideUp("fast");
})
})
</script>
です。いろいろ試行錯誤したのですがドロップダウンメニュ-が表示されず
困っています。何か見落としがあるのでしょうか。よろしくお願いいたします。
お礼
解決しました!コードそのものは問題ありませんでしたが まちがってリンクさせたscriptファイルのコードにも<script type="text/javascript"> を書いていたのが原因だったようです。 <script type="text/javascript">のタグを消したら動作しました。 お早い回答ありがとうございました。