image - 如何在高度未知的视口中居中图像？

Question

我正在使用 BxSlider (http://bxslider.com) 创建一个图片库，并希望在视口中水平和垂直居中图像。我也在使用调整大小的脚本，所以不知道我的图像的尺寸。

我尝试了通过 Google 找到的各种脚本，但似乎没有任何效果。

这是我的html：

<div id="myDiv">

    <div><img src="" /></div>
    <div><img src="" /></div>
    <div><img src="" /></div>

</div>

我的 BxSlider 代码：

<script src="https://raw.github.com/wandoledzep/bxslider/master/jquery.bxSlider.min.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function(){
       $('#myDiv').bxSlider({
       mode: 'fade',
       captions: true,
       });
   });
</script>

还有我的调整大小代码：

function resizeImg() {
    var h = $(window).height();
    if (840 > h) {
        var bw = h - 210;
        $('img').attr('height',bw);
        //alert('Height: '+h);
        // post-container-image
    }
}
jQuery(document).ready(function(){
    var h = $(window).height();
    if (840 > h) {
        resizeImg();
    }
});
$(window).resize(function(){
    var h = $(window).height();
    if (840 > h) {
        resizeImg();
    }
});