移动端横屏返回后无法恢复原来大小解决方案
生活随笔
收集整理的這篇文章主要介紹了
移动端横屏返回后无法恢复原来大小解决方案
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
橫屏彈出提示后,返回豎屏的時(shí)候,顯示頁(yè)面被放的特別大,需雙擊頁(yè)面空白處才能恢復(fù)。
假如移動(dòng)端頁(yè)面是這樣的頭部聲明:
<head><meta charset="utf-8"><title>《刀劍斗神傳》-國(guó)風(fēng)江湖 動(dòng)作手游</title><meta name="Keywords" content="" /><meta name="Description" content="" /><meta name="viewport" content="width=640,minimum-scale=0,maximum-scale=5,user-scalable=no"/> </head>?
?
解決方法為:
假如判斷橫豎屏是這樣處理的
//橫豎屏判斷 function hengshuping() {if (window.orientation == 180 || window.orientation == 0) {$(".horizontal").hide();}if (window.orientation == 90 || window.orientation == -90) {$(".horizontal").show();} }window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", hengshuping, false);解決方法為為:
切換到豎屏后,隔1秒,執(zhí)行設(shè)置viewport屬性值:
//橫豎屏判斷 function hengshuping() {if (window.orientation == 180 || window.orientation == 0) {$(".horizontal").hide();setTimeout(function(){$("meta[name=viewport]").attr("content",'width=639,minimum-scale=0,maximum-scale=1,user-scalable=no');$("meta[name=viewport]").attr("content",'width=640,minimum-scale=0,maximum-scale=1,user-scalable=no');},1000)}if (window.orientation == 90 || window.orientation == -90) {$(".horizontal").show();} }?
轉(zhuǎn)載于:https://www.cnblogs.com/zhidong123/p/7610899.html
總結(jié)
以上是生活随笔為你收集整理的移动端横屏返回后无法恢复原来大小解决方案的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: Kudu安装(官网推荐的步骤)(inst
- 下一篇: spring-boot-starter-