jquery - 使用 jQuery 或 CSS 放置未知高度的动态 div

标签 jquery html css

如何实现

Dynamic divs

有了这个 - 每个 div 都是按照服务器上显示的顺序生成的,并且高度未知:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
   <title>Untitled</title>
    <style type="text/css">
    div {width:100px;color:white;background-color:grey;border:solid 5px black; margin:2px}
    .wrapper {width:331px;height:400px;border:solid 1px black;float:left;}
    </style>
  </head>
<body>
    <form id="form1" runat="server">
   <div class="wrapper">
    <div class="shortDiv" style="float:left;">1 some stuff</div>
    <div class="tallDiv" style="float:left;">2 some stuff some stuff</div>
    <div class="shortDiv" style="float:left;">3 some stuff</div>
    <div class="shortDiv" style="float:left;">4 some stuff</div>
    <div class="shortDiv" style="float:left;">5 some stuff</div>
    <div class="shortDiv" style="float:left;">6 some stuff</div>
    <div class="tallDiv" style="float:left;">7 some stuff some stuff</div>
    <div class="shortDiv" style="float:left;">8 some stuff</div>
    <div class="shortDiv" style="float:left;">9 some stuff</div>
</div>
    </form>
</body>

最佳答案

好的旧 jQuery Masonry 可能会在这方面帮助您:

http://desandro.com/resources/jquery-masonry/

关于jquery - 使用 jQuery 或 CSS 放置未知高度的动态 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5717899/

相关文章:

javascript - 如何在 javascript 中查找并替换一组没有 id 或名称的现有 td 背景图像?

javascript - 未捕获的类型错误。 undefined object 不是函数

javascript - jquery 简单的 ul li 内容 slider

html - CSS Image Sprites 在 IE7 中不工作

javascript - 延迟一段时间后显示第二个 div,如果鼠标悬停在第一个或第二个 div 上,则保持第二个 div 可见

javascript - 使用jQuery检测设备是否可以调用电话(支持 "tel://"协议(protocol))

javascript - 字幕 : element vs. javascript

javascript - 无法获得加号/减号按钮以正常工作 javascript

CSS 过渡在多次更改期间闪烁

jquery - 当列表项超过 UL 高度时,按高度划分列表项