0

你可以看看我的小提琴here。它们之间有空间，但我希望它们彼此重叠。我怎样才能用 jQuery 做到这一点？我尝试使用 Masonry，但这段代码没有帮助：

(function(){
var $container = $('.rss');
$container.imagesLoaded(function(){
  $container.masonry({
    itemSelector : '.item',
    columnWidth : 210
  });
});
})();

编辑：任何人都可以让小提琴工作吗？

4

2 回答 2

1

尝试这个

  $(function(){

$('#container').masonry({
  itemSelector: '.box',
   isAnimated: true
});

});

演示

于 2013-01-09T11:26:48.280 回答
0

听起来你想要 CSS 替代砖石：

http://sickdesigner.com/masonry-css-getting-awesome-with-css3/

它使用CSS3 column-count属性来分割父容器，即设置width:100%；到子容器的宽度是父容器的三分之一，而不是全宽。

示例 CSS：

.container {
    -moz-column-count: 3;
    -moz-column-gap: 10px;
    -webkit-column-count: 3;
    -webkit-column-gap: 10px;
    column-count: 3;
    column-gap: 10px;
    width: 900px
}
.container div {
    display: inline-block; /* Display inline-block, and absolutely NO FLOATS! */
    margin-bottom: 20px;
    width: 100%;
}

此演示已将其设置为列表：

http://sickdesigner.com/demo/css-masonry/css-masonry.html

这是基于您的示例的小提琴：http: //jsfiddle.net/SHZ2G/2/

仅供参考，您仍然可以使用 masonry 来实现 IE 兼容性，如上述文章中所述

于 2013-01-09T11:34:08.760 回答