当图片宽度超过视窗宽度时，如何禁用水平滚动？

当图片宽度超过视窗宽度时，可以通过CSS样式来禁用水平滚动。以下是一种常见的方法：

使用CSS的overflow-x属性来控制水平滚动。将overflow-x属性设置为hidden，可以隐藏超出视窗宽度的内容，从而禁用水平滚动。

body {
  overflow-x: hidden;
}

如果只想禁用特定区域的水平滚动，可以将该区域的CSS选择器替换为body。

#your-element {
  overflow-x: hidden;
}

这样，当图片宽度超过视窗宽度时，水平滚动条将不会出现，用户将无法通过水平滚动来查看超出视窗宽度的内容。

请注意，以上方法只是禁用了水平滚动条的显示，并不会阻止用户通过其他手段（如键盘操作）来滚动内容。如果需要完全禁用水平滚动，可以结合JavaScript来实现。以下是一种常见的方法：

// 禁用水平滚动
function disableHorizontalScroll() {
  // 获取当前滚动位置
  var scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop;

  // 保存滚动位置
  window.onscroll = function() {
    window.scrollTo(scrollLeft, scrollTop);
  };
}

// 启用水平滚动
function enableHorizontalScroll() {
  window.onscroll = null;
}

在需要禁用水平滚动的时候，调用disableHorizontalScroll()函数即可。在需要启用水平滚动的时候，调用enableHorizontalScroll()函数即可。

这样，无论图片宽度是否超过视窗宽度，用户都无法通过滚动来改变内容的水平位置。