手机端下载APK界面

最新推荐文章于 2022-09-29 11:11:36 发布

⑧o年崋

最新推荐文章于 2022-09-29 11:11:36 发布

阅读量692

点赞数

分类专栏： jquery css 文章标签：手机下载界面 css js html

本文链接：https://blog.csdn.net/xnlzg/article/details/111683390

版权

jquery 同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

css

4 篇文章 0 订阅

订阅专栏

在这里插入图片描述

<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>手机端APK下载界面</title>
    <link rel="icon" href="image/favicon.ico">
</head>

<body>
    <style type="text/css">
        .layout-main {
            position: fixed;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            background-image: url('image/bg.png');
        }

        .layout-content {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            width: 90%;
            height: 90%;
            max-height: 470;
            margin: auto;
            overflow: hidden;
            background-image: url('image/bg1.png');
            background-repeat: no-repeat;
            background-position: center left;
            background-size: 100% 100%;
        }

        .layout-download {
            position: absolute;
            left: 23%;
            right: 23%;
            bottom: 8%;
            overflow: hidden;
            height: 40px;
            background-image: url('image/down.png');
            background-repeat: no-repeat;
            background-position: center left;
            background-size: 100% 100%;
            cursor: pointer;
        }
    </style>
    <div class="layout-main">
        <div class="layout-content">
            <div class="layout-download" onclick="downloadFile()"></div>
        </div>
    </div>
    <script type="text/javascript">

        function downloadFile() {
            var isWeixin = is_weixin();
            if (isWeixin) {
                loadHtml();
                loadStyleText(cssText);
            }
            else {
                const url = "www.baidu.com/111.apk";
                const a = document.createElement('a');
                a.style.display = 'none';
                a.href = url;
                a.click();
            }

        }
        function is_weixin() {
            var ua = navigator.userAgent.toLowerCase(); 
            if (ua.match(/MicroMessenger/i) == "micromessenger" || ua.match(/AlipayClient/i) == "alipayclient") {
                return true;
            } else {
                return false;
            }
        }
        //var isWeixin = is_weixin();
        var winHeight = typeof window.innerHeight != 'undefined' ? window.innerHeight : document.documentElement.clientHeight;
        function loadHtml() {
            var div = document.createElement('div');
            div.id = 'weixin-tip';
            div.innerHTML = '<p><img src="image/live_weixin.png" alt="浏览器打开"/></p>';
            document.body.appendChild(div);
        }

        function loadStyleText(cssText) {
            var style = document.createElement('style');
            style.rel = 'stylesheet';
            style.type = 'text/css';
            try {
                style.appendChild(document.createTextNode(cssText));
            } catch (e) {
                style.styleSheet.cssText = cssText; //ie9以下
            }
            var head = document.getElementsByTagName("head")[0]; //head标签之间加上style样式
            head.appendChild(style);
        }
        var cssText = "#weixin-tip{position: fixed; left:0; top:0; background: rgba(0,0,0,0.8); filter:alpha(opacity=80); width: 100%; height:100%; z-index: 100;} #weixin-tip p{text-align: center;padding-right: 20px;} #weixin-tip img{width: 100%;}";
    // if(isWeixin){
    //     loadHtml();
    //     loadStyleText(cssText);
    // }
    </script>
</body>

</html>

请添加图片描述

⑧o年崋

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
手机端下载APK界面

<html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>手机端APK下载界面</title> <link rel="icon" href="image/favicon.ico"></head><.
复制链接

扫一扫

专栏目录