mui开发:苹果手机自动全屏解决方案

前一段时间,使用mui写app时,出现了苹果手机播放视频时,自动全屏的情况,并且无法点击控件,只能等到播放完毕后点击控件。

那么怎么解决这个问题呢,弟弟们请看我的下面。

1.在页面的video标签中,添加 playsinline webkit-playsinline x5-playsinline 属性

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8">
 5     <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
 6     <title></title>
 7     <script src="js/mui.min.js"></script>
 8     <link href="css/mui.min.css" rel="stylesheet"/>
 9     <script type="text/javascript" charset="utf-8">
10           mui.init();
11     </script>
12 </head>
13 <body>
14     <div class="mui-content" style="background-color: #000000;">
15   <!-- 下面video标签中的 playsinline webkit-playsinline x5-playsinline 是重点-->
16         <video width="100%" height="auto" id="videoPlay1" poster="/hyData/weixinPages/images/video-img.png"
17          controls=controls 
18          x5-playsinline=""
19         webkit-playsinline="true"
20          playsinline="true"> 
21             <source src="http://v6-dy.ixigua.com/23ab27365792171b3c1520591002d525/5da0ace0/video/m/220e3b27dfe9b3e4950ba1fc42c6ab2f88e1161977ab0000a0b930ce3267/" type="video/mp4">
22         </video>
23     </div>
24 </body>
25 </html>

2.需要在manifest.json的plus节点下新增allowsInlineMediaPlayback节点为true

1 "plus" : {
2         "splashscreen" : {
3             "autoclose" : true, /*是否自动关闭程序启动界面,true表示应用加载应用入口页面后自动关闭;false则需调plus.navigator.closeSplashscreen()关闭*/
4             "waiting" : true
5         },
6         "allowsInlineMediaPlayback": true,
7         "runmode" : "liberate", /*应用的首次启动运行模式,可取liberate或normal,liberate模式在第一次启动时将解压应用资源(Android平台File API才可正常访问_www目录)*/
8         "signature" : "Sk9JTiBVUyBtYWlsdG86aHIyMDEzQGRjbG91ZC5pbw==", /*可选,保留给应用签名,暂不使用*/

猜你喜欢

转载自www.cnblogs.com/sixgodbiao/p/11979986.html