cn_run.htm 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
  7. <title>猫王妙播_猫王收音机_猫王音响 - 猫王官网</title>
  8. <meta name="description" content="什么是猫王妙播,猫王官方音乐电台频道,365天24小时不间断的好音乐、好内容,为你提供最新鲜有趣的“声活方式”。">
  9. <meta name="keywords" content="猫王妙播">
  10. <link rel="canonical" href="https://www.radio1964.com/ohplay" />
  11. </head>
  12. <script>
  13. const detectDeviceType = () => /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ? "Mobile" : "Desktop";
  14. if (detectDeviceType() === 'Desktop') {
  15. window.location = "http://download.radio1964.com/readme?";
  16. }
  17. var xhr = null
  18. if (window.XMLHttpRequest) {
  19. xhr = new XMLHttpRequest()
  20. } else {
  21. xhr = new ActiveXObject("Microsoft.XMLHTTP")
  22. }
  23. </script>
  24. <body>
  25. <div class="bg">
  26. <div class="box top">
  27. <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/icon-1.png" width="80"
  28. height="80" />
  29. <div class="title">
  30. <h3>猫王妙播Pro</h3>
  31. </div>
  32. <a id="ios" class="btn green" href="https://apps.apple.com/cn/app/com.muzen.radioplayer/id1402502317"
  33. style="margin-bottom: 12px;">
  34. <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/iPhone.png" width="28" height="28" />
  35. <span>iPhone下载</span>
  36. </a>
  37. <a id="Android" class="btn green" href="https://a.app.qq.com/o/simple.jsp?pkgname=com.muzen.radioplayer"
  38. style="margin-top: 12px;">
  39. <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/Android.png" width="28" height="28" />
  40. <span>Android下载</span>
  41. </a>
  42. </div>
  43. <div class="box bottom">
  44. <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/icon-2.png" width="80" height="80" />
  45. <div class="title">
  46. <h3>猫王灵感</h3>
  47. <h4>(猫王手表专用APP)</h4>
  48. </div>
  49. <a id="ios" class="btn purple" href="https://apps.apple.com/cn/app/com.Muzen.MuzenLife/id6449812627"
  50. style="margin-bottom: 24px;">
  51. <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/iPhone.png" width="28" height="28" />
  52. <span>iPhone下载</span>
  53. </a>
  54. <a id="Android" class="btn purple apk" href="#">
  55. <img src="https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/Android.png" width="28" height="28" />
  56. <span>Android下载</span>
  57. </a>
  58. </div>
  59. </div>
  60. </body>
  61. <script>
  62. const userAgent = navigator.userAgent;
  63. var isiOS = !!userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
  64. var isAndroid = userAgent.indexOf('Android') > -1 || userAgent.indexOf('Adr') > -1;
  65. var iOSElement = document.querySelectorAll("#ios")
  66. var AndElement = document.querySelectorAll("#Android")
  67. if (isiOS) {
  68. for (var i = 0; i < AndElement.length; i++) {
  69. AndElement[i].style.pointerEvents = "none"
  70. }
  71. } else {
  72. for (var i = 0; i < iOSElement.length; i++) {
  73. iOSElement[i].style.pointerEvents = "none"
  74. }
  75. }
  76. // 猫王灵感安卓apk下载链接
  77. var apkELement = document.querySelector('.apk')
  78. xhr.open('get', 'https://client.ohplay.radio1964.net/device/project/update/group?projectId=7', true)
  79. xhr.onreadystatechange = function () {
  80. if (xhr.status === 200 && xhr.readyState === 4) {
  81. apkELement.href = JSON.parse(xhr.responseText).data.android[0].downUrl
  82. }
  83. }
  84. xhr.send()
  85. </script>
  86. <style>
  87. * {
  88. margin: 0;
  89. padding: 0;
  90. box-sizing: border-box;
  91. }
  92. html,
  93. body {
  94. height: 100%;
  95. }
  96. a {
  97. text-decoration: none;
  98. font-weight: bold;
  99. }
  100. .bg {
  101. width: 100vw;
  102. height: 100vh;
  103. min-height: 724px;
  104. background-image: url('https://music-play.oss-cn-shenzhen.aliyuncs.com/ohplay_images/download-bg.png');
  105. background-size: cover;
  106. background-repeat: no-repeat;
  107. background-position: center;
  108. position: relative;
  109. }
  110. .box {
  111. width: 100%;
  112. display: flex;
  113. flex-direction: column;
  114. align-items: center;
  115. position: absolute;
  116. }
  117. .top {
  118. top: 40px;
  119. }
  120. .bottom {
  121. bottom: 40px;
  122. }
  123. .title {
  124. margin: 1rem 0 3rem 0;
  125. text-align: center;
  126. }
  127. .title h3 {
  128. font-size: 20px;
  129. font-weight: bold;
  130. }
  131. .title h4 {
  132. font-size: 13px;
  133. color: #777777;
  134. }
  135. .btn {
  136. border-radius: 32px;
  137. width: 13rem;
  138. font-size: 14px;
  139. color: #FFF;
  140. display: flex;
  141. justify-content: center;
  142. align-items: center;
  143. padding: 0.4rem 0;
  144. }
  145. .green {
  146. background: linear-gradient(180deg, #A4D099 0%, #78B06A 100%);
  147. }
  148. .purple {
  149. background: linear-gradient(180deg, #BC58EE 0%, #7C47A3 100%);
  150. }
  151. </style>
  152. <!-- <link rel="canonical" href="https://www.radio1964.com/pindao" />
  153. <link rel="shortcut icon" href="./static/css/favicon.ico">
  154. <link rel="stylesheet" type="text/css" href="./static/css/headerComponent.css">
  155. <link rel="stylesheet" type="text/css" href="./static/css/ohplay.css">
  156. <script type="text/javascript">
  157. if (window.innerWidth <= 1080) {
  158. (function (doc, win) {
  159. var width = 750;
  160. var height = 1220;
  161. var docEl = doc.documentElement;
  162. var reCalc = (function () {
  163. var reCalc = function () {
  164. var winWidth = docEl.clientWidth;
  165. var winHeight = docEl.clientHeight;
  166. if (!winWidth) return;
  167. var fontSize;
  168. if (winWidth / winHeight > width / height) {
  169. fontSize = 100 * winHeight / height;
  170. } else {
  171. fontSize = 100 * winWidth / width;
  172. }
  173. docEl.style.fontSize = fontSize + 'px';
  174. console.log(fontSize, docEl.style.fontSize);
  175. return reCalc;
  176. };
  177. return reCalc();
  178. })();
  179. var rszEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
  180. if (!doc.addEventListener) return;
  181. win.addEventListener(rszEvt, reCalc);
  182. })(document, window);
  183. } else {
  184. (function (doc, win) {
  185. var width = 1920;
  186. var height = 1080;
  187. var docEl = doc.documentElement;
  188. var reCalc = (function () {
  189. var reCalc = function () {
  190. var winWidth = docEl.clientWidth;
  191. var winHeight = docEl.clientHeight;
  192. if (!winWidth) return;
  193. var fontSize;
  194. if (winWidth / winHeight < width / height) {
  195. fontSize = 100 * winHeight / height;
  196. } else {
  197. fontSize = 100 * winWidth / width;
  198. }
  199. docEl.style.fontSize = fontSize + 'px';
  200. console.log(fontSize, docEl.style.fontSize);
  201. return reCalc;
  202. };
  203. return reCalc();
  204. })();
  205. var rszEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
  206. if (!doc.addEventListener) return;
  207. win.addEventListener(rszEvt, reCalc);
  208. })(document, window);
  209. }
  210. </script>
  211. <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  212. <script type="text/javascript" src="./static/js/lib/scrolloverflow.min.js"></script>
  213. <script type="text/javascript" src="./static/js/lib/jquery.fullPage.min.js"></script>
  214. <script type="text/javascript" src="./static/js/module/TD.js"></script>
  215. <style type="text/css">
  216. @media (max-width: 1600px) {
  217. .nav-lang:hover {
  218. height: 84px;
  219. }
  220. }
  221. @media (max-width: 1280px) {
  222. .nav-lang:hover {
  223. height: 72px;
  224. }
  225. }
  226. @media (max-device-width: 1081px) {
  227. .nav-lang:hover {
  228. height: 0.8em;
  229. }
  230. }
  231. .ohplay-station-2 {
  232. 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;
  233. }
  234. .ohplayAlert {
  235. position: fixed;
  236. display: flex;
  237. justify-content: center;
  238. align-items: center;
  239. width: 100%;
  240. height: 100%;
  241. z-index: 1001;
  242. top: 0;
  243. }
  244. .appTips {
  245. position: fixed;
  246. width: 100%;
  247. height: 100%;
  248. z-index: 1001;
  249. background: rgba(255, 253, 242, 0.9);
  250. top: 0;
  251. left: 0;
  252. }
  253. .appTips .appTipsBg {
  254. position: absolute;
  255. opacity: 0.6;
  256. top: 0;
  257. }
  258. .appTips .quak {
  259. position: absolute;
  260. width: 2em;
  261. top: 0.5em;
  262. right: 0.5em;
  263. }
  264. .appTips .brower {
  265. right: 1.5em;
  266. top: 1.5em;
  267. width: 1.5em;
  268. }
  269. .appTips .tipText {
  270. position: absolute;
  271. right: 2.8em;
  272. top: 2em;
  273. }
  274. .appTips .tipText p {
  275. line-height: 0.3em;
  276. font-size: 16px;
  277. }
  278. .appTips .tipsp {
  279. display: flex;
  280. flex-direction: row;
  281. }
  282. </style>
  283. <script>
  284. function Close() {
  285. document.getElementsByClassName("ohplayAlert")[0].style.display = "none";
  286. }
  287. function IosDownload() {
  288. window.location.href = 'https://apps.apple.com/cn/app/ohplay%E7%8C%AB%E7%8E%8B%E5%A6%99%E6%92%AD/id1402502317';
  289. }
  290. function AndroidDownload() {
  291. const u = navigator.userAgent;
  292. const IsWeixin = u.indexOf('MicroMessenger') > -1; // 是否微信内置浏览器
  293. const IsWeibo = u.indexOf('Weibo') > -1; // 是否Weibo内置浏览器
  294. const IsQq = u.indexOf('QQ') > -1 && (u.indexOf('V1_IPH_SQ') > -1 || u.indexOf('V1_AND_SQ') > -1); // 是否QQ内置浏览器
  295. const openTips = IsWeixin || IsQq || IsWeibo;
  296. if (openTips) {
  297. document.getElementsByClassName("ohplayAlert")[0].style.display = "block";
  298. return;
  299. }
  300. window.location.href = 'http://airsmart-photo1.oss-cn-shanghai.aliyuncs.com/download_online/release/oh_play.apk';
  301. }
  302. </script> -->
  303. <!-- <body>
  304. &lt;!&ndash; http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/pindao2_qrcode.jpg
  305. &ndash;&gt;
  306. <div class="m-loading">
  307. <div class="loading-step"></div>
  308. <div class="loading-text">0%</div>
  309. <div class="img-preload">
  310. <img src="https://www.radio1964.com/2020/ohplay_slide_01.png">
  311. <img
  312. src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_02.jpg">
  313. <img src="https://www.radio1964.com/2020/ohplay_slide_03.jpg">
  314. <img
  315. src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_04.jpg">
  316. <img
  317. src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_05.jpg">
  318. <img src="https://www.radio1964.com/2020/ohplay_slide_06.jpg">
  319. <img
  320. src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_07.jpg">
  321. <img src="https://www.radio1964.com/2020/ohplay_slide_08.jpg">
  322. <img
  323. src="http://airsmart-web.oss-cn-shanghai.aliyuncs.com/upload/images/%E9%A2%91%E9%81%93/ohplay_slide_09.jpg">
  324. </div>
  325. </div>
  326. <header class="m-header">
  327. <a href="/index">
  328. <div class="header-logo"></div>
  329. </a>
  330. <div class="nav-wrap">
  331. <div class="nav-shop" onclick="window.open('https://shop45604680.m.youzan.com/v2/feature/xHCSWC6aoP')">
  332. 商城
  333. </div>
  334. <div class="nav-version">
  335. <a href="/radios">
  336. <div class="nav-version-item version-maoking">猫王音响</div>
  337. </a>
  338. <a href="/ohplay">
  339. <div class="nav-version-item version-radiooo nav-version-current">猫王妙播</div>
  340. </a>
  341. </div>
  342. <div class="nav-menu"></div>
  343. </div>
  344. &lt;!&ndash;<div class="subnav-wrap">
  345. <div class="subnav-logo"></div>
  346. <div class="subnav-main-wrap">
  347. <a href="/station">
  348. <div class="subnav-main-item">首页</div>
  349. </a>
  350. </div>
  351. </div>&ndash;&gt;
  352. </header>
  353. <div class="m-maofm">
  354. <div class="maofm-1 section">
  355. <div class="section-content">&lt;!&ndash;{ echo $ohplayData['content'][0]; }&ndash;&gt;</div>
  356. <div class="section-app">
  357. <div onclick="IosDownload()"><img src="./2020/ios.png" /></div>
  358. <div onclick="AndroidDownload()"><img src="./2020/android.png" /></div>
  359. </div>
  360. <div class="section-title">&lt;!&ndash;{ echo $ohplayData['content'][1]; }&ndash;&gt;</div>
  361. </div>
  362. <div class="maofm-2 section section-video">
  363. <div class="video-wrap">
  364. <video class="video" src="&lt;!&ndash;{ echo $ohplayData['video_short_1']; }&ndash;&gt;"
  365. poster="&lt;!&ndash;{ echo $ohplayData['video_img_1']; }&ndash;&gt;" muted="muted"
  366. loop="true"></video>
  367. <div class="btn-videoplay"> </div>
  368. </div>
  369. <div class="video-wrap-2">
  370. <video class="video-2" src="&lt;!&ndash;{ echo $ohplayData['video_long_1']; }&ndash;&gt;"
  371. controls="controls" poster="&lt;!&ndash;{ echo $ohplayData['video_img_1']; }&ndash;&gt;"></video>
  372. <div class="btn-close">+</div>
  373. </div>
  374. </div>
  375. <div class="maofm-3 section">
  376. <div class="shadow-bg"></div>
  377. <h2 class="section-title">&lt;!&ndash;{ echo $ohplayData['title'][1]; }&ndash;&gt;</h2>
  378. <p class="section-content">&lt;!&ndash;{ echo $ohplayData['content'][2]; }&ndash;&gt;
  379. </div>
  380. <div class="maofm-4 section">
  381. <h2 class="section-title">&lt;!&ndash;{ echo $ohplayData['title'][2]; }&ndash;&gt;</h2>
  382. <p class="section-content">&lt;!&ndash;{ echo $ohplayData['content'][3]; }&ndash;&gt;</p>
  383. </div>
  384. <div class="maofm-5 section">
  385. <h2 class="section-title">&lt;!&ndash;{ echo $ohplayData['title'][3]; }&ndash;&gt;</h2>
  386. <p class="section-content">&lt;!&ndash;{ echo $ohplayData['content'][4]; }&ndash;&gt;<br><br>
  387. <span>&lt;!&ndash;{ echo $ohplayData['content'][5]; }&ndash;&gt;</span>
  388. </p>
  389. </div>
  390. <div class="maofm-6 section">
  391. <h2 class="section-title">&lt;!&ndash;{ echo $ohplayData['title'][4]; }&ndash;&gt;</h2>
  392. <p class="section-content">&lt;!&ndash;{ echo $ohplayData['content'][6]; }&ndash;&gt;
  393. </div>
  394. <div class="maofm-7 section">
  395. <h2 class="section-title">&lt;!&ndash;{ echo $ohplayData['title'][5]; }&ndash;&gt;</h2>
  396. <p class="section-content">&lt;!&ndash;{ echo $ohplayData['content'][7]; }&ndash;&gt;</p>
  397. </div>
  398. <div class="maofm-9 section">
  399. <h2 class="section-title">&lt;!&ndash;{ echo $ohplayData['title'][7]; }&ndash;&gt;</h2>
  400. <p class="section-content">&lt;!&ndash;{ echo $ohplayData['content'][9]; }&ndash;&gt;</p>
  401. <div class="ohplay-station ohplay-station-2"></div>
  402. </div>
  403. </div>
  404. &lt;!&ndash;{ echo $footer; }&ndash;&gt;
  405. <div class="ohplayAlert" style="display: none;">
  406. <div class="appTips" onclick="Close()">
  407. <img alt='' class="appTipsBg" src="https://www.radio1964.com/img/share_bg.png" width="100%" />
  408. <img alt='' class="quak" src="https://www.radio1964.com/img/quak_arrow.png" />
  409. <div class="tipText">
  410. <p>点击屏幕右上角[...]</p>
  411. <p>&nbsp;</p>
  412. <p class="tipsp">选择<span style="color: #EC8A32;">"浏览器"</span>打开
  413. </p>
  414. </div>
  415. </div>
  416. </div>
  417. </body>
  418. &lt;!&ndash;
  419. <script type="text/javascript" src="./static/js/module/headerComponent.js"></script>&ndash;&gt;
  420. &lt;!&ndash;
  421. <script type="text/javascript" src="./static/js/ohplay.js"></script>&ndash;&gt;
  422. <style>
  423. .section-app {
  424. display: flex;
  425. flex-direction: column;
  426. justify-content: flex-end;
  427. align-items: center;
  428. }
  429. .section-app div {
  430. position: relative;
  431. z-index: 1000;
  432. color: rgba(220, 190, 160, 1);
  433. font-size: 0.12em !important;
  434. margin-bottom: 0.30em;
  435. display: flex;
  436. justify-content: center;
  437. align-items: center;
  438. border-radius: 0.20em;
  439. bottom: 0.6em;
  440. font-weight: bold;
  441. cursor: pointer;
  442. }
  443. .section-app div img {
  444. width: 1.55em;
  445. height: 0.45em;
  446. }
  447. </style> -->
  448. </html>