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

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();
    }
});