8

如何在手机端实现全屏显示,隐藏地址栏等工具框?

 3 years ago
source link: https://www.geekjc.com/post/61bab9a1ed44bf53641b1266
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client
关注本站公众号获取最新福利

如何在手机端实现全屏显示,隐藏地址栏等工具框?

时间: 12/16/2021作者: 一颗小草浏览量: 2

1. 方式一

控制手机端的全屏显示,隐藏地址栏的功能一般是由浏览器那边来实现的,就是游戏上线后,由渠道那边去调起全屏显示接口,实现游戏的全屏显示。但是也有部分浏览器已经放出了全屏接口,下面给出一些参考,如果没有涉及到的可以网上搜索下。部分浏览器参数参考:

<!-- uc强制竖屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait">
<!-- UC强制全屏 -->
<meta name="full-screen" content="yes">
<!-- QQ强制全屏 -->
<meta name="x5-fullscreen" content="true">
<!-- UC应用模式 -->
<meta name="browsermode" content="application">
<!-- QQ应用模式 -->
<meta name="x5-page-mode" content="app">
<!-- windows phone 点击无高光 -->
<meta name="msapplication-tap-highlight" content="no">
<!-- 适应移动端end -->

2. 方式二

可以考虑封装下面这段代码

var docElm=document.body;
if (docElm.requestFullscreen){
     docElm.requestFullscreen();
 }else if (docElm.msRequestFullscreen){
     docElm.msRequestFullscreen();
 }else if (docElm.mozRequestFullScreen){
     docElm.mozRequestFullScreen();
}else if (docElm.webkitRequestFullScreen){
      docElm.webkitRequestFullScreen();
}

以上就是控制全屏的代码

关注下面的标签,发现更多相似的文章

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK