|
|
@@ -13,8 +13,10 @@
|
|
|
|
|
|
<script>
|
|
|
var xhr = null
|
|
|
+ var maokingXHR = null
|
|
|
if (window.XMLHttpRequest) {
|
|
|
xhr = new XMLHttpRequest()
|
|
|
+ maokingXHR = new XMLHttpRequest()
|
|
|
} else {
|
|
|
xhr = new ActiveXObject("Microsoft.XMLHTTP")
|
|
|
}
|
|
|
@@ -23,7 +25,7 @@
|
|
|
<body>
|
|
|
<div id="pc"></div>
|
|
|
<div id="mobile" class="bg">
|
|
|
- <div class="box top">
|
|
|
+ <div class="box">
|
|
|
<img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/icon-1.png" width="80"
|
|
|
height="80" />
|
|
|
<div class="title">
|
|
|
@@ -42,7 +44,27 @@
|
|
|
<span>Android下载</span>
|
|
|
</a>
|
|
|
</div>
|
|
|
- <div class="box bottom">
|
|
|
+ <div class="box">
|
|
|
+ <img src="https://airsmart-web.oss-cn-shanghai.aliyuncs.com/maoking/maoking_guangwang/maowang_shenghuoguang_logo.png"
|
|
|
+ width="80" height="80">
|
|
|
+ <div class="title">
|
|
|
+ <h3>猫王生活馆</h3>
|
|
|
+ <h4>（歌词音响专用APP）</h4>
|
|
|
+ </div>
|
|
|
+ <a id="ios" class="btn blue"
|
|
|
+ href="https://apps.apple.com/cn/app/%E7%8C%AB%E7%8E%8B%E7%94%9F%E6%B4%BB%E9%A6%86/id6503723234"
|
|
|
+ style="margin-bottom:24px">
|
|
|
+ <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/iPhone.png" width="28"
|
|
|
+ height="28">
|
|
|
+ <span>iPhone下载</span>
|
|
|
+ </a>
|
|
|
+ <a id="Android" class="btn blue maokingapk" href="#">
|
|
|
+ <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/Android.png" width="28"
|
|
|
+ height="28" />
|
|
|
+ <span>Android下载</span>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="box">
|
|
|
<img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/icon-2.png" width="80"
|
|
|
height="80" />
|
|
|
<div class="title">
|
|
|
@@ -96,6 +118,15 @@
|
|
|
}
|
|
|
}
|
|
|
xhr.send()
|
|
|
+ // 猫王生活馆
|
|
|
+ var maokingElement = document.querySelector('.maokingapk')
|
|
|
+ maokingXHR.open('get', 'https://client.ohplay.radio1964.net/device/project/update/group?projectId=9', true)
|
|
|
+ maokingXHR.onreadystatechange = function () {
|
|
|
+ if (maokingXHR.status === 200 && maokingXHR.readyState === 4) {
|
|
|
+ maokingElement.href = JSON.parse(maokingXHR.responseText).data.android[0].downUrl
|
|
|
+ }
|
|
|
+ }
|
|
|
+ maokingXHR.send()
|
|
|
</script>
|
|
|
|
|
|
<style>
|
|
|
@@ -105,10 +136,6 @@
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
|
|
|
- html,
|
|
|
- body {
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
|
|
|
#pc {
|
|
|
display: none;
|
|
|
@@ -119,24 +146,21 @@
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
|
|
|
- #pc{
|
|
|
+ #pc {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
background-image: url('https://airsmart-web.oss-cn-shanghai.aliyuncs.com/maoking/maoking_guangwang/appdownload.jpg');
|
|
|
background-repeat: no-repeat;
|
|
|
background-size: cover;
|
|
|
- background-position: center center;
|
|
|
+ background-position: center;
|
|
|
}
|
|
|
|
|
|
.bg {
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
- min-height: 724px;
|
|
|
- background-image: url('https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/download-bg.png');
|
|
|
- background-size: cover;
|
|
|
+ background-image: url('https://airsmart-web.oss-cn-shanghai.aliyuncs.com/maoking/maoking_guangwang/maowang_shenghuoguang_bg.png');
|
|
|
background-repeat: no-repeat;
|
|
|
+ background-size: cover;
|
|
|
background-position: center;
|
|
|
- position: relative;
|
|
|
+ padding: 40px 0;
|
|
|
}
|
|
|
|
|
|
.box {
|
|
|
@@ -144,15 +168,10 @@
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
- position: absolute;
|
|
|
}
|
|
|
|
|
|
- .top {
|
|
|
- top: 40px;
|
|
|
- }
|
|
|
-
|
|
|
- .bottom {
|
|
|
- bottom: 40px;
|
|
|
+ .box:nth-child(2) {
|
|
|
+ margin: 80px 0;
|
|
|
}
|
|
|
|
|
|
.title {
|
|
|
@@ -185,329 +204,13 @@
|
|
|
background: linear-gradient(180deg, #A4D099 0%, #78B06A 100%);
|
|
|
}
|
|
|
|
|
|
+ .blue {
|
|
|
+ background: linear-gradient(180deg, #a4d4f8 0%, #60abe1 100%);
|
|
|
+ }
|
|
|
+
|
|
|
.purple {
|
|
|
background: linear-gradient(180deg, #BC58EE 0%, #7C47A3 100%);
|
|
|
}
|
|
|
</style>
|
|
|
|
|
|
-<!-- <link rel="canonical" href="https://www.radio1964.com/pindao" />
|
|
|
- <link rel="shortcut icon" href="./static/css/favicon.ico">
|
|
|
- <link rel="stylesheet" type="text/css" href="./static/css/headerComponent.css">
|
|
|
- <link rel="stylesheet" type="text/css" href="./static/css/ohplay.css">
|
|
|
- <script type="text/javascript">
|
|
|
- if (window.innerWidth <= 1080) {
|
|
|
- (function (doc, win) {
|
|
|
- var width = 750;
|
|
|
- var height = 1220;
|
|
|
- var docEl = doc.documentElement;
|
|
|
- var reCalc = (function () {
|
|
|
- var reCalc = function () {
|
|
|
- var winWidth = docEl.clientWidth;
|
|
|
- var winHeight = docEl.clientHeight;
|
|
|
- if (!winWidth) return;
|
|
|
- var fontSize;
|
|
|
- if (winWidth / winHeight > width / height) {
|
|
|
- fontSize = 100 * winHeight / height;
|
|
|
- } else {
|
|
|
- fontSize = 100 * winWidth / width;
|
|
|
- }
|
|
|
- docEl.style.fontSize = fontSize + 'px';
|
|
|
- console.log(fontSize, docEl.style.fontSize);
|
|
|
- return reCalc;
|
|
|
- };
|
|
|
- return reCalc();
|
|
|
- })();
|
|
|
- var rszEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
|
|
|
- if (!doc.addEventListener) return;
|
|
|
- win.addEventListener(rszEvt, reCalc);
|
|
|
- })(document, window);
|
|
|
- } else {
|
|
|
- (function (doc, win) {
|
|
|
- var width = 1920;
|
|
|
- var height = 1080;
|
|
|
- var docEl = doc.documentElement;
|
|
|
- var reCalc = (function () {
|
|
|
- var reCalc = function () {
|
|
|
- var winWidth = docEl.clientWidth;
|
|
|
- var winHeight = docEl.clientHeight;
|
|
|
- if (!winWidth) return;
|
|
|
- var fontSize;
|
|
|
- if (winWidth / winHeight < width / height) {
|
|
|
- fontSize = 100 * winHeight / height;
|
|
|
- } else {
|
|
|
- fontSize = 100 * winWidth / width;
|
|
|
- }
|
|
|
- docEl.style.fontSize = fontSize + 'px';
|
|
|
- console.log(fontSize, docEl.style.fontSize);
|
|
|
- return reCalc;
|
|
|
- };
|
|
|
- return reCalc();
|
|
|
- })();
|
|
|
- var rszEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
|
|
|
- if (!doc.addEventListener) return;
|
|
|
- win.addEventListener(rszEvt, reCalc);
|
|
|
- })(document, window);
|
|
|
- }
|
|
|
- </script>
|
|
|
- <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
|
|
|
- <script type="text/javascript" src="./static/js/lib/scrolloverflow.min.js"></script>
|
|
|
- <script type="text/javascript" src="./static/js/lib/jquery.fullPage.min.js"></script>
|
|
|
- <script type="text/javascript" src="./static/js/module/TD.js"></script>
|
|
|
- <style type="text/css">
|
|
|
- @media (max-width: 1600px) {
|
|
|
- .nav-lang:hover {
|
|
|
- height: 84px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- @media (max-width: 1280px) {
|
|
|
- .nav-lang:hover {
|
|
|
- height: 72px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- @media (max-device-width: 1081px) {
|
|
|
- .nav-lang:hover {
|
|
|
- height: 0.8em;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .ohplay-station-2 {
|
|
|
- background: url('http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_station2.png') no-repeat center center;
|
|
|
- }
|
|
|
-
|
|
|
- .ohplayAlert {
|
|
|
- position: fixed;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- z-index: 1001;
|
|
|
- top: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .appTips {
|
|
|
- position: fixed;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- z-index: 1001;
|
|
|
- background: rgba(255, 253, 242, 0.9);
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .appTips .appTipsBg {
|
|
|
- position: absolute;
|
|
|
- opacity: 0.6;
|
|
|
- top: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .appTips .quak {
|
|
|
- position: absolute;
|
|
|
- width: 2em;
|
|
|
- top: 0.5em;
|
|
|
- right: 0.5em;
|
|
|
- }
|
|
|
-
|
|
|
- .appTips .brower {
|
|
|
- right: 1.5em;
|
|
|
- top: 1.5em;
|
|
|
- width: 1.5em;
|
|
|
- }
|
|
|
-
|
|
|
- .appTips .tipText {
|
|
|
- position: absolute;
|
|
|
- right: 2.8em;
|
|
|
- top: 2em;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .appTips .tipText p {
|
|
|
- line-height: 0.3em;
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
-
|
|
|
- .appTips .tipsp {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- }
|
|
|
- </style>
|
|
|
- <script>
|
|
|
- function Close() {
|
|
|
- document.getElementsByClassName("ohplayAlert")[0].style.display = "none";
|
|
|
- }
|
|
|
- function IosDownload() {
|
|
|
- window.location.href = 'https://apps.apple.com/cn/app/ohplay%E7%8C%AB%E7%8E%8B%E5%A6%99%E6%92%AD/id1402502317';
|
|
|
- }
|
|
|
- function AndroidDownload() {
|
|
|
-
|
|
|
- const u = navigator.userAgent;
|
|
|
- const IsWeixin = u.indexOf('MicroMessenger') > -1; // 是否微信内置浏览器
|
|
|
- const IsWeibo = u.indexOf('Weibo') > -1; // 是否Weibo内置浏览器
|
|
|
- const IsQq = u.indexOf('QQ') > -1 && (u.indexOf('V1_IPH_SQ') > -1 || u.indexOf('V1_AND_SQ') > -1); // 是否QQ内置浏览器
|
|
|
-
|
|
|
- const openTips = IsWeixin || IsQq || IsWeibo;
|
|
|
-
|
|
|
- if (openTips) {
|
|
|
- document.getElementsByClassName("ohplayAlert")[0].style.display = "block";
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- window.location.href = 'http://airsmart-photo1.oss-cn-shanghai.aliyuncs.com/download_online/release/oh_play.apk';
|
|
|
- }
|
|
|
- </script> -->
|
|
|
-
|
|
|
-<!-- <body>
|
|
|
- <!– http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/pindao2_qrcode.jpg
|
|
|
- –>
|
|
|
- <div class="m-loading">
|
|
|
- <div class="loading-step"></div>
|
|
|
- <div class="loading-text">0%</div>
|
|
|
- <div class="img-preload">
|
|
|
- <img src="https://www.radio1964.com/2020/ohplay_slide_01.png">
|
|
|
- <img
|
|
|
- src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_02.jpg">
|
|
|
- <img src="https://www.radio1964.com/2020/ohplay_slide_03.jpg">
|
|
|
- <img
|
|
|
- src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_04.jpg">
|
|
|
- <img
|
|
|
- src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_05.jpg">
|
|
|
- <img src="https://www.radio1964.com/2020/ohplay_slide_06.jpg">
|
|
|
- <img
|
|
|
- src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_07.jpg">
|
|
|
- <img src="https://www.radio1964.com/2020/ohplay_slide_08.jpg">
|
|
|
- <img
|
|
|
- src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_09.jpg">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <header class="m-header">
|
|
|
- <a href="/index">
|
|
|
- <div class="header-logo"></div>
|
|
|
- </a>
|
|
|
- <div class="nav-wrap">
|
|
|
- <div class="nav-shop" onclick="window.open('https://shop45604680.m.youzan.com/v2/feature/xHCSWC6aoP')">
|
|
|
- 商城
|
|
|
- </div>
|
|
|
- <div class="nav-version">
|
|
|
- <a href="/radios">
|
|
|
- <div class="nav-version-item version-maoking">猫王音响</div>
|
|
|
- </a>
|
|
|
- <a href="/ohplay">
|
|
|
- <div class="nav-version-item version-radiooo nav-version-current">猫王妙播</div>
|
|
|
- </a>
|
|
|
-
|
|
|
- </div>
|
|
|
- <div class="nav-menu"></div>
|
|
|
- </div>
|
|
|
- <!–<div class="subnav-wrap">
|
|
|
- <div class="subnav-logo"></div>
|
|
|
- <div class="subnav-main-wrap">
|
|
|
- <a href="/station">
|
|
|
- <div class="subnav-main-item">首页</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>–>
|
|
|
- </header>
|
|
|
- <div class="m-maofm">
|
|
|
- <div class="maofm-1 section">
|
|
|
- <div class="section-content"><!–{ echo $ohplayData['content'][0]; }–></div>
|
|
|
- <div class="section-app">
|
|
|
- <div onclick="IosDownload()"><img src="./2020/ios.png" /></div>
|
|
|
- <div onclick="AndroidDownload()"><img src="./2020/android.png" /></div>
|
|
|
- </div>
|
|
|
- <div class="section-title"><!–{ echo $ohplayData['content'][1]; }–></div>
|
|
|
- </div>
|
|
|
- <div class="maofm-2 section section-video">
|
|
|
- <div class="video-wrap">
|
|
|
- <video class="video" src="<!–{ echo $ohplayData['video_short_1']; }–>"
|
|
|
- poster="<!–{ echo $ohplayData['video_img_1']; }–>" muted="muted"
|
|
|
- loop="true"></video>
|
|
|
- <div class="btn-videoplay"> </div>
|
|
|
- </div>
|
|
|
- <div class="video-wrap-2">
|
|
|
- <video class="video-2" src="<!–{ echo $ohplayData['video_long_1']; }–>"
|
|
|
- controls="controls" poster="<!–{ echo $ohplayData['video_img_1']; }–>"></video>
|
|
|
- <div class="btn-close">+</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="maofm-3 section">
|
|
|
- <div class="shadow-bg"></div>
|
|
|
- <h2 class="section-title"><!–{ echo $ohplayData['title'][1]; }–></h2>
|
|
|
- <p class="section-content"><!–{ echo $ohplayData['content'][2]; }–>
|
|
|
- </div>
|
|
|
- <div class="maofm-4 section">
|
|
|
- <h2 class="section-title"><!–{ echo $ohplayData['title'][2]; }–></h2>
|
|
|
- <p class="section-content"><!–{ echo $ohplayData['content'][3]; }–></p>
|
|
|
- </div>
|
|
|
- <div class="maofm-5 section">
|
|
|
- <h2 class="section-title"><!–{ echo $ohplayData['title'][3]; }–></h2>
|
|
|
- <p class="section-content"><!–{ echo $ohplayData['content'][4]; }–><br><br>
|
|
|
- <span><!–{ echo $ohplayData['content'][5]; }–></span>
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- <div class="maofm-6 section">
|
|
|
- <h2 class="section-title"><!–{ echo $ohplayData['title'][4]; }–></h2>
|
|
|
- <p class="section-content"><!–{ echo $ohplayData['content'][6]; }–>
|
|
|
- </div>
|
|
|
- <div class="maofm-7 section">
|
|
|
- <h2 class="section-title"><!–{ echo $ohplayData['title'][5]; }–></h2>
|
|
|
- <p class="section-content"><!–{ echo $ohplayData['content'][7]; }–></p>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="maofm-9 section">
|
|
|
- <h2 class="section-title"><!–{ echo $ohplayData['title'][7]; }–></h2>
|
|
|
- <p class="section-content"><!–{ echo $ohplayData['content'][9]; }–></p>
|
|
|
- <div class="ohplay-station ohplay-station-2"></div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- <!–{ echo $footer; }–>
|
|
|
- <div class="ohplayAlert" style="display: none;">
|
|
|
- <div class="appTips" onclick="Close()">
|
|
|
- <img alt='' class="appTipsBg" src="https://www.radio1964.com/img/share_bg.png" width="100%" />
|
|
|
- <img alt='' class="quak" src="https://www.radio1964.com/img/quak_arrow.png" />
|
|
|
- <div class="tipText">
|
|
|
- <p>点击屏幕右上角[...]</p>
|
|
|
- <p> </p>
|
|
|
- <p class="tipsp">选择<span style="color: #EC8A32;">"浏览器"</span>打开
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</body>
|
|
|
-<!–
|
|
|
-<script type="text/javascript" src="./static/js/module/headerComponent.js"></script>–>
|
|
|
-<!–
|
|
|
-<script type="text/javascript" src="./static/js/ohplay.js"></script>–>
|
|
|
-<style>
|
|
|
- .section-app {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: flex-end;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
-
|
|
|
- .section-app div {
|
|
|
- position: relative;
|
|
|
- z-index: 1000;
|
|
|
- color: rgba(220, 190, 160, 1);
|
|
|
- font-size: 0.12em !important;
|
|
|
- margin-bottom: 0.30em;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- border-radius: 0.20em;
|
|
|
- bottom: 0.6em;
|
|
|
- font-weight: bold;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
-
|
|
|
- .section-app div img {
|
|
|
- width: 1.55em;
|
|
|
- height: 0.45em;
|
|
|
- }
|
|
|
-</style> -->
|
|
|
-
|
|
|
</html>
|
