当前位置：文江博客话题详情

如何找出导致页面临时呈现水平滚动条的原因？

发布于 2024-11-16 08:49:30 字数 348 浏览 0 评论 0原文

我正在查看以下页面：-

http://www.gearzap.com/

在 Google Chrome 中。

在页面加载期间，由于某种原因，水平滚动条会出现大约半秒。

这显然是导致此问题的原因，但我似乎无法找出导致问题的原因

编辑：- 此处发生此情况的视频：-

http://files.sourceguru.net/scrollbars.ogv

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

柠檬 2024-11-23 08:49:30

我快速浏览了一下（那个页面上有很多 js），navigation.js 文件跳到了我的面前。我设置调试器，发现这个循环迭代8次后：

$j('#navigation .submenu').each(function() {
    var obj = $j(this);
    var cols, w, l, offset;

    cols = obj.find('ul').length;

    obj.css('width', (cols * 200 + 16) + 'px');

    w = obj.outerWidth();
    l = obj.offset().left;
    offset = w + l;

    if(offset > max_w) {
        obj.animate({
            'margin-left' : '-=' + (offset - max_w) + 'px'
        });
    }
});

出现滚动条。

编辑：您也许可以将 obj.animate 转换为 obj.css 。如果这不起作用，您可能需要在设置 css 之前进行计算，而不是设置它，进行计算，然后再次更改它。不知道为什么那是一个动画。

I had a quick look (and man is there a lot of js on that page) and the navigation.js file jumped out at me. I set the debugger and found that after 8 iterations of this loop:

$j('#navigation .submenu').each(function() {
    var obj = $j(this);
    var cols, w, l, offset;

    cols = obj.find('ul').length;

    obj.css('width', (cols * 200 + 16) + 'px');

    w = obj.outerWidth();
    l = obj.offset().left;
    offset = w + l;

    if(offset > max_w) {
        obj.animate({
            'margin-left' : '-=' + (offset - max_w) + 'px'
        });
    }
});

the scrollbar appears.

EDIT: You may be able to just get away with turning that obj.animate into an obj.css. If that doesn't work you might need to do the calculations prior to setting the css at all, rather than setting it, doing the calculations and then changing it again. Not sure why that was ever an animate to begin with.

回复收藏 0 原文