滑塊溢出頁面

Question

誰能幫我一下嗎？ 我將此徽標滑塊插入到頁面中，效果很好，但是由於網站引擎的“基本”寬度設置，模塊基本上在頁面上沒有完整寬度。

我想使滑塊全屏顯示，所以我用以下代碼溢出了它：

customcontent5> div.module-body {溢出：可見；}

但是此代碼使滑塊流出屏幕，並且頁面隨着滑塊的移動而自動滾動。 如何使滑塊大小適合頁面寬度？ （而不是其他所有模塊的基本寬度）

謝謝您的幫助，

碼：

 $(document).ready(function() { $('.customer-logos').slick({ slidesToShow: 6, slidesToScroll: 1, autoplay: true, autoplaySpeed: 1000, arrows: false, dots: false, pauseOnHover: false, responsive: [{ breakpoint: 768, settings: { slidesToShow: 4 } }, { breakpoint: 520, settings: { slidesToShow: 3 } }] }); }); 

 /* Slider */ .slick-slide { margin: 0!important; } .slick-slide img { width: 85%; height: 85%; display: block; } .slick-slider { position: relative; display: block; box-sizing: border-box; user-select: none; touch-callout: none; touch-action: pan-y; tap-highlight-color: transparent; margin: 0!important; max-width: 990px!important; } .slick-list { position: relative; display: block; overflow: visible; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; right: 0; display: block; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } 

 <div class="container"> <section class="customer-logos slider"> <div class="slide"><img src="images/image1.png"></div> <div class="slide"><img src="images/image2.png"></div> <div class="slide"><img src="images/image3.png"></div> <div class="slide"><img src="images/image4.png"></div> <div class="slide"><img src="images/image5.png"></div> <div class="slide"><img src="images/image6.png"></div> <div class="slide"><img src="images/image7.png"></div> <div class="slide"><img src="images/image8.png"></div> </section> </div> <script src="https://code.jquery.com/jquery-2.2.0.min.js" type="text/javascript"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> 

Answer 1

使其溢出：滾動至CSS文件中的.slick-list {並檢查。