现在已经坚持使用webkit溢出滚动触摸几天了.我正在努力做一些非常直接的事情 - 但是它证明是棘手的!
当我点击某个元素时,我想通过JS抓住它并用它做点什么.然而,当它在'webkit-overflow-scrolling:touch'div中时,一旦iOS的动量滚动接管,元素似乎就跟不上了.IE我开始滚动,虽然列表仍然滚动,我点击一个它似乎访问一个不正确的元素?理想情况下,我想确定动量滚动何时开始,以及它是否仍在进行中 - 一个点击只是停止它而不是首先选择一个元素,但我甚至无法使基础工作.
我在带有iOS 6.01的iPad 3上进行测试.看起来webkit滚动非常错误,因为onscroll事件看起来也很有气质,有时会触发滚动结束以外的其他时间,这与通用的iOS使用不同.
如果有人对如何使这种行为正常工作有任何想法,而不使用iScroll或关闭webkit-overflow-scroll,那将非常感谢!
<style>
li {
height: 40px;
background: #999;
}
</style>
<div style="-webkit-overflow-scrolling: touch; height: 400px; background: #CCC; width: 400px; overflow: scroll;" >
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li>
<li>15</li>
<li>16</li>
<li>17</li>
<li>18</li>
<li>19</li>
<li>20</li>
<li>21</li>
<li>22</li>
<li>23</li>
<li>24</li>
<li>25</li>
<li>26</li>
<li>27</li>
</ul>
</div>
<div id="content"></div>
<script>
var elements = document.getElementsByTagName('li');
for(var i = 0, len = elements.length; i < len; i++) {
elements[i].ontouchstart = function (e) {
document.getElementById('content').innerHTML = document.getElementById('content').innerHTML+this.innerHTML;
}
}
</script>
Run Code Online (Sandbox Code Playgroud)
我发现我的项目中的势头也非常不稳定。此类错误有时可以通过硬件加速滚动条内的元素来修复。尝试一下,看看它是否适合你。以下是有关如何硬件加速元素的更多信息:http ://davidwalsh.name/translate3d
| 归档时间: |
|
| 查看次数: |
944 次 |
| 最近记录: |