我正在创建一个完全像这样的缩略图库(http://tmv.proto.jp/#!/destroyftw).目前我正在尝试制定脚本理论.网页的实际脚本在这里(http://tmv.proto.jp/tmv_v3.js).因为我对javascript相对较新,这让我有些沮丧.
我已经尝试过使用砌体和同位素等插件,但是它们无法处理大量的图像.更不用说无限滚动不适用于我需要的过滤.所以我决定尝试自己编码.
这个想法是用户提交的图像将被调整为具有设定宽度的缩略图(高度当然会被缩放以保持纵横比).然后这些缩略图将用于创建图库.我遇到的问题是,我发现布局有点棘手.
看起来页面首先被分成列以形成第一个"行".之后,缩略图放在最左边的最短列中(具体来说,我想知道这种特定图像定位技术背后的理论). 例如:数字也可以理解为图像的ID.(ID = "I_1" ID = "I_2"等)

这也会导致页面加载的级联淡入效果以及附加新图像(它们根据其ID简单地淡入).我试图使用上面的脚本页面作为参考无济于事.但是如果有人想自己检查我认为负责缩略图定位的功能是在"ViewManager"下.
重申一下,我不是在寻找有人为我工作.我只是需要帮助制定理论,所以我将有一个开始的地方.
**Note**(In the script): cellSize= 100; cellMargin=1; doubleSize=201 (cellSize*2+cellMargin); totalCellSize=101 (cellSize+cellMargin);
Run Code Online (Sandbox Code Playgroud)