如何从 javascript 设置-webkit-overflow-scrolling 样式？答案

【问题标题】：How to set -webkit-overflow-scrolling style from java script?如何从 javascript 设置-webkit-overflow-scrolling 样式？
【发布时间】：2014-06-04 06:07:41
【问题描述】：

我必须使用 java 脚本设置 -webkit-overflow-scrolling 我尝试使用以下代码但无法正常工作

$("#myDiv").css("-webkit-overflow-scrolling","none");

在“myDiv”上，我应用了 .scrollable 类，如下所示

.scrollable{
             overflow-y: scroll;
             -webkit-overflow-scrolling: touch;
           }

【问题讨论】：

您想使用脚本将其设置为touch 还是none..？您的代码似乎没有任何语法错误。问题一定是其他问题.. 你确定 div 有一个 id myDiv，你已经链接了查询，你的脚本在创建后运行.. 等等..？
我必须将 none 设置为 -webkit-overflow-scrolling - 是的，它有 myDiv id - 我已链接 jQuery - 我的脚本在创建后运行我通过更改 -webkit- 在调试模式下进行了测试溢出滚动值“触摸”到“无”，它工作正常但是当我尝试通过 javascript 运行时，它不工作
Any way to apply 'webkit-overflow-scrolling: touch' inline with javascipt?的可能重复

标签： jquery html css cordova phonegap

【解决方案1】：

您可以像这样使用 javascript 设置 webkit-overflow-scrolling 属性：

document.getElementById("myDiv").style.webkitOverflowScrolling = "auto";

edit: none 我认为这不是一个有效值，这就是它不起作用的原因。我认为“自动”是您想要的。

根据文档，您可以使用以下选项：https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html

自动：一根手指无动力滚动。

touch：原生风格滚动。指定此样式具有创建堆叠的效果上下文（如不透明度、蒙版和变换）

【讨论】：

没有像 webkitOverflowScrolling 这样的任何 html 元素的属性，所以它不起作用
我不是在元素上调用它，而是在 element.style 上调用它。所以元素。style.webkitOverflowScrolling，它在 Safari 上

【解决方案2】：

你能像工具一样创建一个类吗？

当内容宽度小于 700 像素时，我可以在我的网站上使用它

.tool-device-touch {
  @media (max-width: 700px) {
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
  }
}

你可以这样做

$("#myDiv").addClass('tool-device-touch');

哇，差不多 4 年前就问过了... :-D

【讨论】：