在固定可视区域中使用不同大小的图像的照片库

Question

我希望你能提供帮助，我希望这不是重复的（我已经在寻找过去2个小时试图寻找解决方案）。

我目前正在做什么：

我正在使用Pikachoose照片库 - http://www.pikachoose.com但我对其他人开放。我只需要一个非常基本的照片库，我可以从数据库填充。我已经让照片库看起来我需要它的95％，但我遇到了一个大问题。尽管设置了宽度，但高度不是因为这会导致图像偏斜。我认为大多数图像都是风景图。因此，当滑块旋转通过图像时会发生什么，主要较大的可视区域会根据加载的图像改变高度。如果所有图像都具有相同的高度/宽度会很好，但这不可能，因为我无法控制所加载的图像。 它们被加载到无序列表中，单击时将打开一个包含完整图像的页面。

我需要它做什么：

我熟悉精灵是如何工作的，但我想知道是否有办法将这种类型的功能合并到滑块中（即Flickr用于缩略图）。我想要一个固定的高度/宽度可视区域，例如220px x 150px，并将图像加载到最长边220 + 40像素（如果它是一个窄图像）并居中，但你仍然只看到220px x 150px。与缩略图相同，我希望它们设置宽度/高度50x50像素，它们现在是，但图像被压扁。如果我可以解决主图像或缩略图，我想我可以解决另一个。但我甚至不知道从哪里开始。

请参阅下面的视觉示例。 注意：我的缩略图是指“将最短边设置为50px”而不是最长...