我正在开发一个使用Vimeo视频嵌入的应用程序，并且遇到了在iPhone X移动浏览器中观察到的错误。问题在于，当用户滚动屏幕时触摸任何嵌入后，UI元素（例如按钮）的响应速度会稍有下降。如果您不触摸任何视频，则可以快速轻按按钮。触摸视频后，需要稍稍按一下按钮。我隔离了此问题，可以在这里观察到：https://codepen.io/tlewismedia/pen/OJJrYNp
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Document</title>
</head>
<body>
<iframe src="https://player.vimeo.com/video/373640046?title=0&byline=0&portrait=0&badge=0" width="640" height="235" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>
<hr>
<button onclick="incr()" style="font-size: 30px">click</button>
<div id="count"></div>
<script>
var count = 0;
window.onload = (event) => {
document.querySelector('#count').innerHTML = count;
};
function incr(){
count = count + 1;
document.querySelector('#count').innerHTML = count;
}
</script>
</body>
</html>
此问题在移动Safari和移动chrome中均会发生。