jquery - gallery with auto resizing images

Question

i want to make a image gallery with auto resizing images. Is that even possible? this is how i want it to work

1. the container of the gallery is an element with fixed height and width
2. the preview of the images could be square so it doesn't matter if the images are portrait or landscape
3. the previews should resize itself according to how much images are inside of the container
4. then if you click on the preview a lightbox or something like that should open with navigation, description to the picture and close button

is there anybody who could help me with this?

Answer 1

这是一个示例解决方案：DEMO，代码（仅适用于单行，请参阅下面的更新）。

我正在使用fancybox，但您可以使用其他一些插件。

jQuery :

var imgCount = $('.container img').length;
ContainerWidth = $('.container').outerWidth();
$('.container img').each(function() {
  $(this).css({
    'width' : Math.floor(ContainerWidth/imgCount),
    'height' : 'auto'
  });
});

---

更新

我找到了这个插件，它似乎提供了你需要的东西。