Html 如何阻止用户在我的网站上水平滚动

以下是网站：

基本上，我有一些超宽的元素，所以它们看起来像是从屏幕右侧出来的。然后我使用

overflow-x:hidden隐藏溢出，但这并不能阻止用户在使用触控板时水平滚动页面，或者单击并向右拖动鼠标

场地是流动的，因此设置
overflow-x：隐藏
不是问题，但必须在
主体
/
html
标记上设置，而不是在内容包装上设置，因为这会破坏设计

我还使用此jQuery代码片段尝试提供帮助：

(function($) {
    $(window).scroll( function() {
        $(window).scrollLeft(0);
    });
})(jQuery);

我在过去成功地使用过它，但在这种情况下，我似乎无法让它发挥作用。下面是一个JSFIDLE，显示了在简化测试用例中工作的上述代码段：

有什么建议吗

另外，它在iOS上的行为应该是正常的

更新：我想我已经设法让jQuery代码段停止了通过触摸板的水平滚动，但是点击和拖动仍然有效（我无法解释，因为测试用例也停止了点击和拖动，就像它在我的网站上应该做的那样）。
看起来它对我有效。（无论我对页面做了什么，我都没有看到水平滚动条。）我认为
overflow-x
是正确的解决方案，您不应该需要JavaScript来完成。我会使用
html{overflow-x:hidden}
，但看起来您已经在这样做了。我要做的第一件事是在验证页面并修复“两个连续连字符”错误
 我没有看到水平滚动条，但我可以使用鼠标滚轮上的横向滑动功能，并观察屏幕移动。看起来您的主要内容元素设置为适合屏幕的大小，但是标题和节标题中的图像将永远重复。我不确定你是如何定义你的css的，但它可能很简单，只要给你的标题加上一个宽度，就可以让它停止

你的
和
关于我的
似乎是罪魁祸首。使用css限制其宽度可以解决问题。
建议1
将最大宽度应用于
主体
。大概是这样的：

body
{
    max-width:   100%;
    margin:    0 auto;
    overflow: visible;
}

我在Chrome和IE9上进行了测试，我注意到的唯一问题是跳转。
我通过更改此选项解决了此问题：

body,
html {
    overflow-x: hidden;
    width: 100%;
}

为此：

html {
    overflow-x: hidden;
    width: 100%;
}

它是
overflow-x:hidden在导致问题的body元素上。
对您无效的内容对我有效。我使用了下面的代码，它工作了

body,
html {
    overflow-x: hidden;
    width: 100%;
}

当我尝试时：

html {
    overflow-x: hidden;
    width: 100%;
}

它不起作用。
介意在
div#container
上使用
overflow-x
吗？@过路人这样做会直接影响网站的设计，所以不幸的是，这不是一个选项。在演示中，我无法滚动，当鼠标拖动时，反弹很有趣，但不是more@eicto您使用的是什么操作系统/浏览器？这基本上是我想要的行为，但没有反弹。也许用户使用他们的触控板或点击并拖动他们的鼠标，因为他们想看到任何不适合他们的浏览器窗口…不幸的是，这不是问题所在。章节标题的标题中没有图像，只有任意大的宽度。body元素使用overflow-x:hidden将其切断；但由于某些原因，您仍然可以使用其他技术进行滚动…如果您使用chrome并检查蓝色和红色框元素上的元素，chrome显示它们比预期延伸得更远。可能你只需要用css限制这些元素的宽度，这不是问题所在（它们实际上并没有超出预期，这是有意的）。溢出x：隐藏；我们应该解决这个问题。出于某种原因，在这个特定的例子中，它不是，我想知道为什么。我不是说滚动条，我是说在某些情况下可以滚动，尽管没有滚动条。@joshnh好的，我想我理解，但我没有可以复制它的设备。将
position:absolute
或
position:fixed
添加到相关元素中是否有任何效果？遗憾的是没有。我想我已经成功地停止了在触摸板上的水平滚动，但单击和拖动仍然有效。@joshnh也许你可以使用类似的命令来禁用拖动事件：@joshnh我想拖动事件（）只适用于具有“draggable”属性的元素。也许有一个不同的鼠标事件可以解决这个问题：这似乎是可行的。关于为什么需要这样做才能获得预期的行为，有什么想法吗？实际上，只需删除overflow-x:hidden；宽度：100%；从body元素中修复了该问题。无论如何谢谢你！一点也不。您的回答指示我应用一个最大宽度，这是我已经在使用的东西。让我这样说：我知道为什么会发生这种情况，这是我的修复想法之一（有效）。你知道为什么会这样吗？（真的，如果你这样做了，我会从这个页面上删除我所有的帖子，并为你的答案投票）让我问你，如果你知道发生了什么，为什么，为什么不解释一下？！请继续…这是禁止左右滚动的最实际的方法。你有自己的赏金吗？：）我不知道。我想我们会发现的@你没有得到你自己的赏金。你能接受你自己的答案吗？这有点道理，但很糟糕。接受，就像在标记它是正确的，但不要指定它的赏金。你能详细说明一下你的答案吗？谢谢