宽度 100% 但额外的宽度正在滚动

Question

这太奇怪了，但还是要试试。 所以我有这个 100% 的旋转木马。我的屏幕尺寸是 1366 像素。我的网站是垂直的，所以滚动会自动出现。它使网络更像 1350 像素。但是我的轮播仍然占用 1366px 宽度并且在底部有滚动。 有趣的是，当我尝试检查时，底部滚动消失了。当我检查时，我的宽度是 1350px。我已经尝试修复它好几个小时了。

我最后的希望是你们。所以请帮助我。

编辑：上传 http://leoxid.com/test/home_page.html 哦，请在 Chrome 上查看。没有做任何其他浏览器修复：D

Answer 1

我的猜测是您的 jQuery 在页面完全加载之前正在执行。这可以通过在jQuery(document).ready(function(){ }); 上执行您的代码来解决，或者，如果这不起作用，则超时：

<script type="text/javascript" language="javascript">
    $(document).ready(){
        setTimeout(function(){
            $(function() {
                $('#foo2').carouFredSel({
                    width       : "100%",
                    align       : "center",
                    auto        : false,
                    prev        : '#prev2',
                    next        : '#next2',
                    pagination  : "#pager2",
                    scroll      : 3,
                    items       : {
                        visible : 9,
                    }
            });
        });
    }, 500);
});
</script>

可能不需要超时，但只是为了确定。

在您为轮播调用函数的位置上，它应该是这样的。

$(document).ready() 等待文档完全加载。 setTimeout 会额外等待半秒，以确保所有内容都已真正加载。 （在图像加载缓慢的情况下很有用）。

如果超时过大，可以去掉下面两行

setTimeout(function(){
}, 500);

Answer 2

看起来当轮播初始化时（准备好了吗？），里面的内容还没有完全加载，它的总高度小于浏览器客户区的总高度。并且在初始化期间，轮播将其宽度“固定”为它以计算方式获得的宽度。

一旦解决方案是将overflow: scroll 应用于您的身体，那么即使在轮播初始化之前，也始终会占用最右侧的 16px 左右。