Question

您好我之前在我的桌面时间制作了这个网站，但刚刚意识到水平滚动潜水在Safari中不起作用。

#galleryscroller {
    overflow-x:scroll ;
    overflow-y:hidden;
    overflow:-moz-scrollbars-horizontal !important;
    height:138px; 
    width:360px;
}

<div id="galleryscroller">
<table width="100%"  border="0" cellspacing="0" cellpadding="6">
<tr align="left" valign="middle">
<td><a onclick="return showPic(this)" href="blahblah.jpg"><img src="blahblah.jpg" alt="Events" width="76" height="100" border="0" /></a></td>
<td><a onclick="return showPic(this)" href="blahblah.jpg"><img src="blahblah.jpg" alt="Events" width="100" height="67" border="0" /></a></td>
</tr>
</table>
</div>

网站就在这里 - www.tobymurphy.com

任何人都可以提供帮助吗？到目前为止，Google上的答案都没有效果......

Answer 1

当你需要隐藏其中一个滚动条时，WebKit引擎会有一个滚动的怪癖。请尝试以下方法：

#galleryscroller {
  overflow: none;
  overflow-x: auto;
  display: block;
  height: 138px;
  width: 360px;
}

注意第一次重置以使溢出为无。

Answer 2

添加white-space: nowrap;到#galleryscroller样式。这应该解决它，如果它不起作用，尝试使位置绝对。

Answer 3

我自己最近发现了这个“不会滚动DIV”的问题。 Safari 6（WebKit）中存在问题，但Chrome（也是WebKit）没有问题。所以不能说它是“WebKit问题”。

在我的情况下，垂直滚动条显示在Safari 6中，但它被冻结。但是，如果您抓取表格内部的文本（位于DIV内部），然后上下拖动该文本，它将滚动。

我也可以确认将以下样式添加到DIV并不能解决问题：

white-space: nowrap;

您可以在此处查看我网站上的问题（截至2013年3月1日）： http://visionsecurity.jp/jp/buy.html

这是日语，但你仍然可以看到问题。只需点击日本地图上最右边的黄色方块，即最右边第一个黄色方块下方的黄色方块。

但原始问题的“基本答案”是这样的：没有答案/解决方案我们可以解决，因为这个DIV滚动问题似乎是SAFARI的BUGARI 。我已经讲了一些网络程序员，他们告诉过我。所以在这种情况下，问题的最终“解决方案”似乎完全来自Apple。我们网页设计师和程序员唯一可以做的就是刺激Apple加快修复浏览器中错误的步伐：

http://www.apple.com/feedback/safari.html

Answer 4

我知道这是旧的，但我最近遇到了这个问题，并认为值得一提的是，这也可能是缺少 z-index 引起的。就我而言，我必须专门为要滚动的 div 设置 z-index，而且它只发生在 Safari 中。

水平滚动div在Safari中不起作用

4 个答案: