0

我的html代码如下：（底部信息）

<!DOCTYPE html>
<html>
    <head>
        <title>My Site</title>
        <link type='text/css' rel='stylesheet' href='style/style1.css'></link>
        <script type='text/javascript' src='scripts/jquery-2.0.0.min.js'></script>
        <script type='text/javascript' src='scripts/script1.js'></script>
    </head>
    <body>
        <div id="title">
            <h1>Welcome to My Site</h1>
        </div>
        <div id='menu_Bar'>
            <div id='home' class='selector'>
                <div class='back'>
                    <ul class='empty'>
                        <li>Home</li>
                        <div style='display: none'>
                            <li><a href=''>option 1</a></li>
                            <li><a href=''>option 2</a></li>
                            <li><a href=''>option 3</a></li>
                            <li><a href=''>option 4</a></li>
                            <li><a href=''>option 5</a></li>
                        </div>
                    </ul>
                </div>
            </div>
        </div>
    </body>
</html>

我的 jQuery 是：

$(document).ready(function() {
    $('.selector').mouseenter(function (){
        $(this.'div ul div').slideToggle('slow');
    });

现在我知道最后一部分不起作用（因为我会问它是否起作用）。但我敢肯定，你明白我想要做什么。I'm trying to make it so when the selector is hovered over it will open its set of links. 我几乎打算在第二部分使用 .options ，但意识到它会在同一个类中全部更改（或影响），这将不允许在侧面放置类似的按钮。那么有人会如何使用父母来影响父母的孩子呢？

的CSS：

div {
    border: 1px solid black;
}

.empty {
    list-style: none;
}

.options {
    display: none;
    background-color: lightblue;
}

.selector {
    background-color: transparent;
}
4

1 回答 1

0

应该是

$(document).ready(function() {
    $('.selector').mouseenter(function (){
        $(this).find('> div > ul > div').slideToggle('slow');
    });
});

演示：小提琴

于 2013-06-08T02:11:30.260 回答