移动网站上的Javascript使屏幕太宽

Question

这是网站：

http://philly.thedrinknation.com/mobile

在智能手机上，屏幕太宽 - 允许您向右滚动一点，而不是精确适合。

在桌面上，您可以在FF中重现此选项，使浏览器的宽度约为350像素，然后使用键盘箭头向右滚动。

我已将其缩小为来自sharethis的javascript：

http://w.sharethis.com/button/buttons.js

如果我拿出那个电话，页面就可以了。将其重新添加（即使在不使用小部件的页面上），滚动也会返回。

看起来他们在3月份修改了他们的代码，我猜这可能是相关的。我问过他们，但到目前为止还没有回应。

有人能指点我进一步调试吗？如果需要，我会在本地复制.js文件进行编辑，但到目前为止，我无法看到导致问题的原因。

Answer 1

严格来说，您的问题不是由javascript引起的。相反，它是由AddThis使用的样式引起的。 AddThis使用的#stwrapper元素的显式宽度为354px，导致您的问题。这个问题是由这个来自AddThis样式表（由他们托管）的css引起的：

.stwrapper {
    position: absolute;
    width: 354px; /* This is causing the issue. The width of this element ensures that the page can never be smaller than 354px */
    z-index: 1000000;
    margin: 0;
    padding: 0;
    top: 0;
    left: 0;
    visibility: hidden;
    height: auto;
}

由于此样式表来自AddThis并且您无法控制它，因此您需要覆盖自己样式表中的样式，同时确保AddThis仍然按预期工作。

我无法看到你实际上在哪里使用AddThis，所以我很难建议你应该做什么样的风格调整来解决宽度问题并保持AddThis工作，但是像下面这样的东西将是一个好的开始：

.stwrapper {
    width:auto;
}