以不同图像大小居中的幻灯片页面

Question

我有一个幻灯片放映，在页面中垂直/水平居中(通过窗口调整jquery)。

它可以很好地处理相同大小的图像。但是，如果我想让不同大小的图像在div中垂直/水平居中，该如何工作呢？

更新:我设法解决了这个问题。下面是JSFIDDLE：http://jsfiddle.net/mihaene/FSeAe/3/

解决方案是将此属性赋予居中DIV中的IMG：

margin:auto; top:0; bottom:0; left:0; right:0;

我不确定，但也许，这可以用一种更简单的方式来完成。欢迎提出任何建议。

Answer 1

在幻灯片放映导航单击时调用resize方法。

Answer 2

试试这个css，它适用于尺寸小于div #slideshow的图像

#slideshow img { margin:0 auto;}

我使用下面的方法来调整尺寸。

function resizeDimensions(oldW, oldH, nuW, nuH){

        // resize according to given width
        if(nuW!=null){
                nuH = (oldH*nuW)/oldW;
            }
        else
        if(nuH!=null)   // resize according to given Height
            {
                nuW = (nuH*oldW)/oldH;
            }

         var dimensions = new Array(nuW, nuH);
     return dimensions;

     }