如何用javascript编程复杂的图像网格

How to program a complexe images grid with javascript

本文关键字：图像网格复杂编程何用 javascript 更新时间：2023-09-26

对于投资组合网站，我必须开发一个可视化的图像网格。

我现在正在为这个网格做测试。

我有两种选择：

1.一个简单的网格，垂直对齐，就像这个线框上的网格：http://daviddarx.com/stuffs/work/barbu/wireframe/search/simple.png

有几个插件可以做到这一点，如果需要的话，我可以很容易地开发一个自定义的解决方案。但是这个网格有点过于简单和普通。我很想得到一个像这样更复杂的网格：

2.一个复杂的网格，没有任何垂直或水平对齐，就像这个线框上的网格：http://daviddarx.com/stuffs/work/barbu/wireframe/search/complexe.png

但对于这个，我真的不知道如何从概念上开始开发它
以下是我的问题：

-我很想开发一个自定义网格，以获得我想要的东西。关于如何开发这样一个网格，你有什么建议、策略和教程吗？哪些步骤，如何启动，等等…

-否则，你知道有什么插件或库可以做到这一点吗？

提前感谢您的帮助！David

这个jQuery插件可以做你想做的事情：http://isotope.metafizzy.co/

如果不能，请解释原因，我会试着看看是否能想出不同的解决方案。

您可以使用jQuery插件砌体。如果你想自己做，你可以使用树图算法，但也有一个jQuery插件树图。