如何在textarea的i-os设备中显示垂直滚动条？

Question

textarea中的垂直滚动条显示在I.E，FF和Chrome中，但不显示在ipod / ipad等i-os设备中。

<textarea  id="termsConditions" cols="30" rows="5" readonly="readonly">Sample text sample           text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample</textarea>

如何解决这个问题？

非常感谢提前。

Answer 1

就像迈克尔哈尔平所说的那样。将-webkit-overflow-scrolling: touch添加到您的样式中。

HTML

<textarea  id="termsConditions" cols="30" rows="5" readonly="readonly">Sample text sample           text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample</textarea>

CSS

#termsConditions {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}​

DEMO

Answer 2

它对我有用

::-webkit-scrollbar {width: 10px;}
::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px;}
::-webkit-scrollbar-thumb {border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);}

希望这对你有用