这是一个创建于 597 天前的主题，其中的信息可能已经有所发展或是发生改变。
我现在是用 js 算的绝对定位铺上去的，可是每当窗口 resize 的时候，就会多少出现点问题。 各位前端大兄弟可有妙计？ 或者可以推荐给我一个什么库吗？ 谢谢各位！
 |
1
acthtml 2023-04-07 08:47:31 +08:00  1
自己写一个，思路：先装大石头，再装小沙子。
先随机大的图并确定位置，例如 3x3, 2x2 ，其余部分用 1x1 的图填充。 |
 |
2
dawnven 2023-04-07 08:58:50 +08:00 1
要实现一个照片墙，可以使用前端框架 (如 React 、Angular 、Vue 等) 以及相应的库或组件。以下是一些可能有用的库或组件:
React GridLayout:这是一个用于在 React 中实现网格布局的库。它可以帮助你轻松地创建具有不同大小照片的照片墙。 Ng-Grid:这是一个用于 Angular 的网格布局库。它也可以帮助你创建照片墙，并且提供了一些选项来控制照片的大小和排列方式。 VueGridster:这是一个用于 Vue.js 的网格布局组件，它可以帮助你轻松地创建照片墙。它支持不同大小的照片，并且可以根据需要自定义布局。 Photo Gallery:这是一个用于 React 的相册组件，它可以轻松地显示多张照片，并且可以根据需要自定义样式。 Pixastic:这是一个用于 JavaScript 的图像处理库，它可以将照片墙转换为动画效果。 以上这些库或组件都可以用于实现照片墙，具体选择哪一个取决于你的需求和偏好。 -------------------------- 我帮你问 chatgpt 了 |
 |
3
7anshuai 2023-04-07 08:59:51 +08:00
|
 |
4
Seanfuck 2023-04-07 08:59:58 +08:00
瀑布流，数量固定的话 table ，图片用背景图填充方式
|
 |
5
throns 2023-04-07 09:00:26 +08:00 via iPhone 1
|
 |
7
henryxie2093 2023-04-07 10:27:37 +08:00
这不是 https://www.artstation.com 吗？
看下人家页面怎么写的 |
|
8
henryxie2093 2023-04-07 10:28:56 +08:00
|
 |
9
IceBay 2023-04-07 10:31:51 +08:00
|
 |
10
jifengg 2023-04-07 10:48:32 +08:00
用库固然是一个好办法，不过这个貌似不复杂，你不妨贴一下你具体遇到的问题。我刚花点时间写了一个，没碰到 resize 有问题。
|
 |
11
kongkx 2023-04-07 12:33:44 +08:00 via iPhone
display grid 。加上 nth-child 应该能处理
|
 |
12
shabbyin 2023-04-07 13:06:51 +08:00 via iPhone
grid 会自动填充到合适的位置 比 flex 更智能
|
 |
13
6IbA2bj5ip3tK49j 2023-04-07 13:30:12 +08:00
|
 |
14
phub2020 2023-04-07 15:01:50 +08:00
一楼的老哥想法就很好，如果不用已有的轮子的话，那先准备盒子，再填充内容就很不错
|
 |
15
urnoob 2023-04-07 15:13:17 +08:00
我是纯后端
再大的图片都是小图片组成的，标记使用过的区域（二维数组），用算法选择合适大小图片，外加点随机大小图。剩下 resize 就应该是 css 相关了吧 |
 |
16
tomcats 2023-04-07 16:11:34 +08:00 via iPhone
Transform scale 整体缩放
|
 |
17
Envov 2023-04-07 17:51:39 +08:00
grid 应该可以实现
|
Select Language