Question

我在控制我的幻灯片问题时遇到问题我想要显示我一年中的几个月，但是当我在2015年徘徊于2014年的那个月时，我也会如何做到这一点。

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>

Answer 1

您需要使您的选择器位更具体（找到孩子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

在ul li上滑动切换

1 个答案: