我们遇到了一个非常奇怪的问题,似乎不可能在屏幕上获得元素的正确位置和大小。该代码在 Android 上完美运行,但在 iOS 上这些值总是太大,通常会为占用不到三分之一的元素返回屏幕上一半以上的空间。返回的值通常在屏幕上低于元素,并且比元素高得多。这是除以之后的devicePixelRatio结果。
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<style>
#text-container > p {
text-align: justify;
transition: background-color 1s;
font-size: 3vh;
}
.selected {
background-color: rgba(253, 230, 65, 0.5);
}
</style>
<script src="jquery.min.js"></script>
<script src="jquery.scrollTo.min.js"></script>
<!-- Custom double-tap detector, couldn't get other solutions to work -->
<script>
function onElementsDoubleTap($els, callback) {
var doubleTapThresholdMs = 250;
var asArray = [];
for (var i = 0; i < $els.length; i++)
asArray.push($els[i]);
asArray.forEach(function (el) …Run Code Online (Sandbox Code Playgroud)