标签:length event 元素 eve IV gettime err false 实现
移动端web开发最好用rem单位,再设置以下js,以iphone6 750*1334为基准
<script> var size = document.documentElement.clientWidth / 750 * 100; //PC端訪問時,默認viewport為100 if (!/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { size = 100; } document.documentElement.style.fontSize = size + ‘px‘; //解决iOS safari 禁用缩放无效问题 window.onload = function () { document.addEventListener(‘gesturestart‘, function (e) { e.preventDefault(); }); document.addEventListener(‘dblclick‘, function (e) { e.preventDefault(); }); document.addEventListener(‘touchstart‘, function (event) { if (event.touches.length > 1) { event.preventDefault(); } }); var lastTouchEnd = 0; document.addEventListener(‘touchend‘, function (event) { var now = (new Date()).getTime(); if (now - lastTouchEnd <= 300) { event.preventDefault(); } lastTouchEnd = now; }, false); }; </script>
相当于在根html元素设置了font-size:100px
html { font-size: 100px; }
会根据移动端尺寸大小对应改变根html的font-size,从而实现对各种屏幕大小的兼容
div { font-size: .14rem; // 字体就被对应设置成14px width: 2rem; // 宽度被对应设置成200px }
标签:length event 元素 eve IV gettime err false 实现
原文地址:https://www.cnblogs.com/peter-web/p/9145854.html