在文本框上滑动时,iPhone滚动错误

Question

在文本框上滑动时,iPhone滚动错误

我有一个包含以下html 的网页:

<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=0">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
    <div style='display:flex;flex-direction:column;height:100%;'>
        <div style='overflow:auto'>
            <div style='height:500px; background:green;'></div>
            <div class='container'>
                <div class='row'>
                    <div class='col-sm-6'>
                        <input type='text' style='' class='form-control' placeholder='swipe here' />
                    </div>
                </div>
            </div>
            <div style='height:500px; background:blue;'></div>
        </div>
    </div>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

将其加载到iPhone上.尝试通过滑动来上下滚动.现在尝试通过在"滑动此处"的文本框中开始滑动来滚动.对我来说,当我这样做时它不会滚动.我正在使用iPhone 6S.

这是一个错误吗？我该如何解决这个问题？

Answer 1

Gib*_*ias 1

该问题出现在 iPhone 6s 及更高版本上。

看来是由引起的<div style='overflow:auto'>。删除后overflow，页面也会通过滑动文本框滚动。

在 iPhone 6s、6s+、7、8 和 X 上的 Safari 中进行了测试。希望这会有所帮助。

归档时间：	7 年，10 月前
查看次数：	615 次
最近记录：	7 年，10 月前