2015-03-02 78 views
0

只是一個javascript和jquery這裏的新手。我對圖像的外觀有點麻煩。該框架不縮小以適應圖像。有什麼建議麼?bxSlider框架比內容更寬

www.helencrolls.com

HTML

<!-- Calling the bxSlider functionality --> 
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - --> 
<script> 
    $(document).ready(function(){ 
     $('.bxslider').bxSlider({ 
      <!-- slideWidth: 600--> 
     }); 
    }); 
</script> 

的Javascript默認

var defaults = { 

    // GENERAL 
    mode: 'fade', 
    slideSelector: '', 
    infiniteLoop: true, 
    hideControlOnEnd: false, 
    speed: 500, 
    easing: null, 
    slideMargin: 0, 
    startSlide: 0, 
    randomStart: false, 
    captions: true, 
    ticker: false, 
    tickerHover: false, 
    adaptiveHeight: true, 
    adaptiveHeightSpeed: 500, 
    video: false, 
    useCSS: true, 
    preloadImages: 'visible', 
    responsive: false, 
    slideZIndex: 50, 
    wrapperClass: 'bx-wrapper', 

    // TOUCH 
    touchEnabled: true, 
    swipeThreshold: 50, 
    oneToOneTouch: true, 
    preventDefaultSwipeX: true, 
    preventDefaultSwipeY: false, 

    // PAGER 
    pager: true, 
    pagerType: 'full', 
    pagerShortSeparator: '/', 
    pagerSelector: null, 
    buildPager: null, 
    pagerCustom: null, 

    // CONTROLS 
    controls: true, 
    nextText: 'Next', 
    prevText: 'Prev', 
    nextSelector: null, 
    prevSelector: null, 
    autoControls: false, 
    startText: 'Start', 
    stopText: 'Stop', 
    autoControlsCombine: false, 
    autoControlsSelector: null, 

    // AUTO 
    auto: false, 
    pause: 2500, 
    autoStart: true, 
    autoDirection: 'next', 
    autoHover: false, 
    autoDelay: 0, 
    autoSlideForOnePage: false, 

    // CAROUSEL 
    minSlides: 1, 
    maxSlides: 1, 
    moveSlides: 0, 
    slideWidth: 0, 

    // CALLBACKS 
    onSliderLoad: function() {}, 
    onSlideBefore: function() {}, 
    onSlideAfter: function() {}, 
    onSlideNext: function() {}, 
    onSlidePrev: function() {}, 
    onSliderResize: function() {} 
} 

回答

0

,而不是max-with嘗試以下方法,讓我知道,如果甜食你的需要:

.bx-wrapper img { 
    width: 100%; 
    display: block; 
    text-align: center; 
}