pinterest启发仪表板布局

Question

上周末，我们在瑞典举办了一次大规模的黑客马拉松活动，几周前我向组织者发出的建议是为Instagram创建一个灵感激动的网络应用程序，因为他们没有大量的网络存在。

我使用twitter bootstrap轻松创建布局，并想知道如何完善pinterest类型的布局？

以下是我正在运行的循环示例。

{% for obj in images %}
    <div class='span3'>
        <div class='thumbnail'>
            <img src="{{ obj.images.low_resolution.url }}" href="{% url dashboard_get_media obj.id %}" data-toggle="modal" data-target="#myModal"/><br />
            <div class='social-items'>
                ...
            </div>
            <br />
            <div class='clearfix'></div>
            <div class='comment'>
                ...
            </div>
            <div class='clearfix'></div>
            {% for comment in obj.comments %}
                ...
                <div class='clearfix'></div>
            {% endfor %}
        </div>
        <br />
    </div>
{% endfor %}

非常感谢您的帮助。

地址为http://instadashapp.com/

Answer 1

如果您不反对为您的需求添加其他插件，Masonry javascript plugin专门用于创建填充尽可能多的空白的内容网格。