bxSlider jQuery插件同样高度变宽

Question

我正在使用此插件创建图片库。但是，我试图弄清楚如何设置图像，使其具有相同的高度但具有不同的宽度。在bxslider images with different widths中，它提供了一个解决方案，但它为图库中的图像设置了固定宽度，因此不再使其响应。

另一部分是如何使bxSlider的背景透明，因此它显示了我的html的背景。我的代码如下，感谢您给予的任何帮助。

HTML：

<div class="container-fluid">

    <div id="back_to_story">
        <a href="ourstory.html">Our Story</a>
    </div> <!-- back_to_story -->

    <!-- NAVIGATION -->
    <div id="navigationmenu">
    </div>

    <p id="time">
    </p>

    <div class="main_container">

        <div class="col-lg-2 col-md-2 col-sm-2" id="before">
           <p><span id="prev"></span></p>
        </div>

        <div class="col-lg-8 col-md-8 col-sm-8" id="content" style="background:#666">
      <!--       GALLERY -->
            <ul class="bxslider">
                <li><img src="assets/slides/image1.png"></li>
                <li><img src="assets/slides/image2.jpg"></li>
                <li><img src="assets/slides/image3.jpg"></li>
            </ul>

        </div>

        <div class="col-lg-2 col-md-2 col-sm-2" id="after">        
            <p><span id="next"></span></p>
        </div>

JQUERY：

jQuery(document).ready(function(){
    jQuery('.bxslider').bxSlider({
        pager:false,
        nextSelector: '#next',
        prevSelector: '#prev',
        nextText: 'NEXT',
        prevText: 'PREV'
    });
});

CSS：

.container-fluid{
    margin:0 auto;
    height:100%;
    padding:50px;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#before, #after{
    background-color: red;
}

#prev, #next{
    text-align:center;
    vertical-align: middle;
    display: table-cell;
}

#content{
    min-height: 100%
}

.bxslider{
    top:-5px;
    left:-5px;
}
.bx-wrapper .bx-viewport 
{
    -moz-box-shadow: 0;
    -webkit-box-shadow: 0;
    box-shadow: none;
    border: 0;
    left: 0;

        -webkit-transform: translatez(0);
        -moz-transform: translatez(0);
        -ms-transform: translatez(0);
        -o-transform: translatez(0);
        transform: translatez(0);

    height:100%;
    background-color: none;
}