VUE 页面禁止缩放(华为平板浏览器可能失效)

h5页面移动端禁止缩放、web页面禁止浏览器缩放

移动端优先,可禁止用户缩放和双击放大;

在App.vue中的script内的方法里加入以下代码:

window.onload = function() {
			document.addEventListener('touchstart', function(event) {
				if (event.touches.length > 1) {
					event.preventDefault()
				}
			})
			document.addEventListener('gesturestart', function(event) {
				event.preventDefault()
			})
		}

pc端移动端都在index.html里标签里写上下面代码:

 pc端( 或 ios移动端 )在index.html里标签里写上下面代码:

到这里为止绝大部分机型设备都能被禁止掉双指/双击缩放,但开发过程中页面上有输入框,这个时候就会发现明明禁止掉的缩放,页面怎么又放大了?

这是因为给输入框设置比页面的 font-size 更大的值, 比如页面设置font-size: 14px,输入框需设置font-size: 14.5px以上则聚焦时页面不会放大。

综合以上页面缩放问题完美解决!

你可能感兴趣的:(JS,vue,webview,javascript)