javascript - 仅父级的动画填充

Question

我有一个带下拉菜单的标题，现在我想在滚动时编辑标题的填充，但我不想更改下拉菜单的填充... HTML:

<li><a>Menu</a>
<ul>
    <li><a>Dropdown</a></li>
    <li><a>Dropdown</a></li>
    <li><a>Dropdown</a></li>
    </ul>
</li>

J查询:

$(".navigator li").animate({ paddingTop : '15px', paddingBottom : '15px' }, {duration: 200, queue:false});

现在如何让 child 的填充保持为 0？

Answer 1

假设.navigator是你 parent 的类(class)<ul>元素，您可以使用 direct descendent selector ( > ):

$(".navigator > li").animate({ paddingTop : '15px', paddingBottom : '15px' }, {duration: 200, queue:false});