h5禁止缩放

最新推荐文章于 2025-05-22 23:49:05 发布

閉丄眼聆厛倖輻

最新推荐文章于 2025-05-22 23:49:05 发布

阅读量405

点赞数

分类专栏： uni-app 文章标签： javascript html html5

本文链接：https://blog.youkuaiyun.com/weixin_52005030/article/details/120625192

版权

uni-app 专栏收录该内容

12 篇文章

订阅专栏

这篇博客主要介绍了如何通过JavaScript禁用移动设备上的页面缩放功能，包括使用meta标签设置视口属性，以及添加事件监听器阻止多点触摸和双击放大操作，确保页面在不同设备上保持固定比例显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// 禁用缩放

function addMeta() {
    $('head').append('<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />');
}
setTimeout(addMeta, 3000);

// 禁用双指放大

document.documentElement.addEventListener('touchstart', function (event) {
    if (event.touches.length > 1) {
        event.preventDefault();
    }
}, {
    passive: false
});

// 禁用双击放大

var lastTouchEnd = 0;
document.documentElement.addEventListener('touchend', function (event) {
    var now = Date.now();
    if (now - lastTouchEnd <= 300) {
        event.preventDefault();
    }
    lastTouchEnd = now;
}, {
    passive: false
});