根据屏幕分辨率实现元素的自动重新调整大小/定位

时间:2011-01-28 20:32:52

标签: javascript html css resolution

我一直在关注http://www.nytimes.com/chrome并想知道如何实现与他们类似的功能。更具体地说,请注意,当您重新调整浏览器窗口大小时,故事数量及其维度会动态变化。

在我的情况下,我有一个流体宽度< div>内部有无序列表,我希望根据浏览器窗口尺寸动态调整显示的元素数量(< li>)。

是否有可以帮助我实现此目的的Javascript库?

3 个答案:

答案 0 :(得分:1)

它被称为responsive design。还有css框架支持这种类型的设计,如Less Framework 3Flaw{LESS} CSS Framework

答案 1 :(得分:1)

我使用这三篇文章作为此类事物的参考:

真正流畅的网站的两个主要技术是:

  1. 不同的主题取决于浏览器的大小(可以使用CSS meda查询,JavaScript等实现)
  2. 每个主题都定义为百分比/ ems,像素。 (这适用于主题中的所有内容:文本,方框,图像,所有内容。)
  3. 撰写所有这些文章的人Ethan Marcotte有example site使用这些想法。

答案 2 :(得分:0)

您也可以查看此插件:Smart Columns。我已经使用过它,它非常适合这种类型的布局。