无法选择iOS设备上使用的iFrame文本(WebKit的)

问题描述 投票:0回答:1

看来,在iOS设备上的移动选择文本时,从页面的顶部包含在偏移iFrame中(填充,保证金)无法正常工作。

在下面的例子中,如果打开的页面:在iOS移动浏览器https://viking2917.github.io/mobileselectionbug/,并把它们挖掘和保持在第一线,将其选中单词“阿梅特”,然后试图通过拖动文本选择扩大选择拖动手柄,拖动手柄将立即跳转至接近页面的底部,如果拖动它周围,你会看到拖动手柄是从你的手指偏移(由iframe是从页面顶部的偏移量的样子)。

该HTML重现此(在上面的链接主持):

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, user-scalable=no">
  </head>
  <body>
    <div>
      <div>
    <div style="height: 200px;"></div>
    <iframe srcdoc="<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam dignissim neque nec ante suscipit semper. Sed sit amet rutrum metus, in mattis ante. Quisque at nunc tellus. Maecenas ut rhoncus erat, sit amet ultricies augue. Aliquam et consectetur mauris. Pellentesque porttitor accumsan pretium. Vivamus risus lorem, varius in laoreet vel, interdum nec metus. Nam gravida vehicula lorem at lobortis. Curabitur sit amet libero ut nulla fermentum volutpat sed at mauris. Ut mollis at tellus vel tincidunt. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer lacinia iaculis odio, sed tincidunt massa accumsan a. Aliquam arcu urna, ullamcorper sagittis nunc eu, facilisis tempor felis. Ut fermentum justo in risus ullamcorper, tempus viverra neque venenatis. Aenean lectus sapien, interdum ut congue non, hendrerit sed diam. Suspendisse ante tellus, luctus eget ex eu, faucibus porttitor nulla.</p><p> Aliquam iaculis placerat tincidunt. Donec justo ligula, dictum ac volutpat accumsan, molestie eu est. Pellentesque lectus est, elementum sed finibus non, scelerisque a nunc. Cras id ornare turpis. Quisque consequat erat turpis. Vestibulum ut nulla feugiat, pretium eros et, dignissim nisi. Sed et finibus turpis. Morbi viverra vulputate lacus.</p><p>Sed in lorem laoreet, gravida metus nec, cursus nunc. Proin dignissim elit id urna imperdiet commodo. Nullam laoreet elementum risus vel tristique. Praesent aliquam ante id nibh condimentum, in semper lectus porta. Proin commodo leo sit amet finibus consectetur. Nam posuere lorem elit, at eleifend odio lobortis nec. Aenean ultricies tellus nec nunc porta, id hendrerit dui malesuada. Aliquam vel lacus feugiat tellus fermentum sollicitudin. Suspendisse consectetur ipsum ac ligula tincidunt molestie. Aenean vel ex eget justo pretium sodales eu sed lectus. Quisque malesuada rutrum tincidunt. Cras sit amet massa pulvinar, fermentum ante in, tristique diam. Etiam nec semper mauris. Donec ultricies purus ut est scelerisque eleifend imperdiet accumsan mi.</p>">
    </iframe>
      </div>
    </div>
  </body>
</html>

我不能看到我做错什么,什么想法?

真的感觉就像一个浏览器的bug。这是在移动设备上的Chrome,Safari和Firefox打破。

html ios css iframe mobile
1个回答
0
投票

这是一款iOS / Safari浏览器的bug。解决方法是在测试12.2,在某些时候被释放。详情点击此处:https://bugs.webkit.org/show_bug.cgi?id=193663

© www.soinside.com 2019 - 2024. All rights reserved.