javascript - 使网站横幅幻灯片占据整个宽度

是否有办法使下面站点中显示的横幅图像连续？我的意思是，在示例中，当前的横幅图像在左侧被截断，并且在其位置上是前一个图像的一部分。
我希望当前图像占据横幅的整个宽度。有可能吗？
Here's the Website Template
以下是我认为滑块的重要部分：
CSS:

.wrapper ul {
    padding-left:490px
}

.anythingSlider {
    position:relative
}

.anythingSlider .wrapper {
    width:1920px;
    overflow:auto;
    height:405px
}

/* Width below is max for Opera */
.anythingSlider .wrapper ul {
    width:32700px;
    list-style:none
}

.anythingSlider .wrapper ul li {
    display:block;
    float:left;
    padding:0;
    width:auto;
    margin:0
}

JavaScript代码：

base.setCurrentPage = function(page, move) {
    // Set visual
    if (base.options.buildNavigation){
        base.$nav.find('.cur').removeClass('cur');
        captions.fadeIn(50);
        $(base.$navLinks[page - 1]).addClass('cur');
    };

    // Only change left if move does not equal false
    if (move !== false) base.$wrapper.scrollLeft(base.singleWidth * page);

        // Update local variable
        base.currentPage = page;
    };

    base.goForward = function(autoplay) {
        if(autoplay !== true) autoplay = false;
        base.gotoPage(base.currentPage + 1, autoplay);
        captions.fadeOut(200);
    };

    base.goBack = function() {
        base.gotoPage(base.currentPage - 1);
        captions.fadeOut(200);
    };

HTML格式：

<div id="slider-container">
    <div id="slider-holder">
        <div class="anythingSlider">
            <div class="wrapper">
               <ul>
                   <li>
                       <a href="#"><img src="images/content/banner1.png" alt="" /></a>

                       <p class="caption">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores</p>
                   </li>

                   <li>
                       <a href="#"><img src="images/content/banner2.gif" alt="" /></a>

                       <p class="caption">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione</p>
                   </li>

                   <li>
                       <a href="#"><img src="images/content/banner3.gif" alt="" /></a>

                       <p class="caption">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam</p>
                   </li>
                </ul>
             </div>
       </div>

       <div id="bevel"></div>
   </div>
</div>

最佳答案

我想你的图片太小了，但是幻灯片包装的左边有一个490px填充。尝试将其更改为100px并查看其功能。它是第一种样式。slider.css

关于javascript - 使网站横幅幻灯片占据整个宽度，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8704146/