显示/隐藏所有列表元素的效果

Question

我正在尝试使用文件夹构建图库。当用户按下文件夹名称时，它会隐藏所有图片并仅显示该文件夹的图片。我已设法做到这一点，但是当图像隐藏或显示时，它们会更改移动到一列然后设置动画。我怎样才能让他们一直保持在线？

$('#folderList li').click(function () {
    var folderToShow = $(this).attr('id');
    $('#galleryList li').hide("slide", {}, 1000);
    $('#galleryList li.' + folderToShow).show("slide", {}, 1000).css("display", "inline-block");
});

Example jsFiddle

Answer 1

在CSS中添加一个float属性

#galleryList ul li {
    display: inline-block;
    margin: 10px;
    float:left
}