почему слайд тумблер прыгает? а как заставить его применять только к статье кликали?

Question

Хорошо, вот мой jsfiddle - http://jsfiddle.net/8947F/

в основном, кажется, что slideToggle добавляет, затем убирает некоторую высоту внизу, чтобы она выглядела, как будто она прыгает ...

Такжещелчок влияет на все скрытые элементы, как я могу применить его только к одному, в частности

, вот мой 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, когда его родитель начинает щелкать?и что случилось с этим «прыжком» ???

Заранее спасибо

Answer 1

проверить это jsfiddle

http://jsfiddle.net/8947F/14/

работает хорошо и гладко!

Answer 2

Потому что он выбирает все folder-items.Вы должны ограничить это, чтобы найти в текущей статье нажатие, передавая контекст (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");
    });
});

Удалите высоту 100% из класса css-папок, это решит проблему с прыжками

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

Демо

Answer 3

Попробуйте изменить

.folder-items {
    height:auto;
}

http://jsfiddle.net/8947F/4/