开发者社区> niunan> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

mui封装做好的手机版网站为apk

简介:
+关注继续查看

BOSS提到的一个功能,就是把已经做好的手机网站http://xxx.com/m/home/index ,想着看起来应该蛮简单,一个html页面里就一个iframe就好了,然后宽度和高度都设置为100%, 试了下,宽度没问题,就是高度的话100%是没有用的,试过在我的MX2手机上是可以100%撑开,钽是在同事的华为手机上又不能撑开了,上网搜索了一下,可以用JS来取得整个窗口的高度,下面是代码,直接写在MUI的新建 的项目中的INDEX.HTML页面就行了


<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title></title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
    </style>
    <script type="text/javascript">
        document.addEventListener('plusready', function() {
            //console.log("所有plus api都应该在此事件发生后调用,否则会出现plus is undefined。"
        //    var h = plus.webview.currentWebview().height; 这是错的,取不到值
            //console.log("当前页面URL:" + plus.webview.currentWebview().getURL() + " ,当前窗口高度:" + h);

        //    document.getElementById('frm1').style.height = h + "px";
        });

        function setIframeHeight(iframe) {
            if(iframe) {
                var iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindow;
                if(iframeWin.document.body) {
                    iframe.height = iframeWin.document.documentElement.scrollHeight || iframeWin.document.body.scrollHeight;
                    console.log("窗口高度:" + iframe.height);
                    document.getElementById('frm1').style.height = iframe.height + "px";
                }
            }
        };

        window.onload = function() {
            setIframeHeight(document.getElementById('frm1'));
        };
    </script>
</head>

<body>
    <iframe id="frm1" style="border:none;width:100%;height:100%;" src="http://baidu.com/"></iframe>
</body>

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Apache Flink SQL概览
本篇核心目标是让大家概要了解一个完整的Apache Flink SQL Job的组成部分,以及Apache Flink SQL所提供的核心算子的语义,最后会应用Tumble Window编写一个End-to-End的页面访问的统计示例。
1138 0
《Spark与Hadoop大数据分析》——2.1 Apache Hadoop概述
本节书摘来自华章计算机《Spark与Hadoop大数据分析》一书中的第2章,第2.1节,作者 [美]文卡特·安卡姆(Venkat Ankam),译 吴今朝,更多章节内容可以访问云栖社区“华章计算机”公众号查看。
1635 0
Apache Spark 1.6 Hadoop 2.6 Mac下单机安装配置
一、 下载资料 1. JDK 1.6 +  2. Scala 2.10.4 3. Hadoop 2.6.4  4. Spark 1.6    二、预先安装 1. 安装JDK 2. 安装Scala 2.
1346 0
Apache Spark源码走读(十一)浅谈mllib中线性回归的算法实现&Spark MLLib中拟牛顿法L-BFGS的源码实现
本文简要描述线性回归算法在Spark MLLib中的具体实现,涉及线性回归算法本身及线性回归并行处理的理论基础,然后对代码实现部分进行走读。第二部分讲解Spark MLLib中拟牛顿法L-BFGS的源码实现。
4699 0
基于hadoop2.7集群的Spark2.0,Sqoop1.4.6,Mahout0.12.2完全分布式安装
写在前边的话        hadoop2.7完全分布式安装请参考:点击阅读,继任该篇博客之后,诞生了下面的这一篇博客        基本环境:               CentOS 6.5,Hadoop 2.
1092 0
Disk2vhd – utility to creates Virtual Hard Disk
Disk2vhd is a utility that creates VHD (Virtual Hard Disk – Microsoft’s Virtual Machine disk for...
770 0
+关注
niunan
没有什么网站是数据库增删查改做不了的,如果有,那就不接这单!
237
文章
10
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载