Jquery 为什么要滑来滑去？如何使其仅适用于点击的文章？

好的，这是我的JSFIDLE-

基本上，滑动切换看起来是在底部增加然后去掉一些高度，这样它看起来像是在跳跃

此外，单击会影响所有隐藏的div，如何使其仅应用于特定的div

这是我的jquery

$(function() {
$('article .folder-hover').hide();

    $('article').hover(function(){
    $(this).children('.folder-hover').show();
    },
function(){
    $(this).children('.folder-hover').hide();
});    

});

$(function() {
$('article .folder-items').hide();    


$("article").click(function () {
  $(".folder-items").slideToggle("slow");
});
});

有没有办法让它只在单击父div时影响子div？ “跳跃”是怎么回事

---

提前感谢

，因为它正在选择所有的

文件夹项目

。您应该通过传递上下文（

this

，在您的情况下）来限制它在当前单击的文章中查找。试试这个

$(function() {
    $('article .folder-hover').hide();
    $('article').hover(function(){
        $(this).children('.folder-hover').show();
    },
    function(){
        $(this).children('.folder-hover').hide();
    });    
});

$(function() {
    $('article .folder-items').hide();    

    $("article").click(function () {
      $(".folder-items", this).slideToggle("slow");
    });
});

从文件夹项目css类中删除100%高度这将修复跳跃问题

.folder-items {
    clear: left;
    padding-top: 12px;
    margin-left: 48px;
    list-style: none;
}

尝试更改

.folder-items {
    height:auto;
}

---

查看这个JSFIDLE

工作很顺利