我在控制我的幻灯片问题时遇到问题我想要显示我一年中的几个月,但是当我在2015年徘徊于2014年的那个月时,我也会如何做到这一点。
示例fiddle
HTML:
strict mode
CSS:
<form name="radioTest"action="radiobuttontest.php" method="post"> ...
SCRIPT:
<ul class="year">
<li>2015
<ul class="months">
<li>Jan</li>
<li>feb</li>
</ul>
</li>
<li>2014
<ul class="months">
<li>march</li>
<li>april</li>
</ul>
</li>
</ul>
答案 0 :(得分:2)
您需要使您的选择器位更具体(找到孩子months
,它是悬停的li
的直接后代)。你也有无效的html(ul
不能直接嵌套在另一个ul
内)。
尝试:
//Bind event on the `li` that is direct descendant of .year
$(".year > li").hover(function () {
//Get its direct descendant `.months` and toggle
$(this).children(".months").stop(true).slideToggle("slow");
});
和
<ul class="year">
<li>2015
<ul class="months">
<li>Jan</li>
<li>feb</li>
</ul>
</li>
<li>2014
<ul class="months">
<li>march</li>
<li>april</li>
</ul>
</li>
</ul>
<强> Fiddle
包装标签和使用兄弟选择器的另一个例子:
$(".year > li > span").hover(function (e) {
$(this).next().stop(true).slideToggle("slow");
});
和
<ul class="year">
<li><span>2015</span>
<ul class="months">
<li>Jan</li>
<li>feb</li>
</ul>
</li>
<li><span>2014</span>
<ul class="months">
<li>march</li>
<li>april</li>
</ul>
</li>
</ul>
<强> Fiddle