Optimize loader tips for outdated browser
This commit is contained in:
parent
5f7461e8aa
commit
cfacb77d15
@ -2,7 +2,8 @@
|
|||||||
<html lang="zh-CN">
|
<html lang="zh-CN">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta content="webkit" name="renderer">
|
||||||
|
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
|
||||||
<meta content="width=device-width,initial-scale=1.0" name="viewport">
|
<meta content="width=device-width,initial-scale=1.0" name="viewport">
|
||||||
<script>var _paq = window._paq || [];
|
<script>var _paq = window._paq || [];
|
||||||
_paq.push(['setRequestMethod', 'POST'], ['trackPageView'], ['enableLinkTracking'], ['setSiteId', '2'],
|
_paq.push(['setRequestMethod', 'POST'], ['trackPageView'], ['enableLinkTracking'], ['setSiteId', '2'],
|
||||||
@ -12,7 +13,40 @@
|
|||||||
<title>音乐解锁 - By IXarea</title>
|
<title>音乐解锁 - By IXarea</title>
|
||||||
<meta content="音乐,解锁,ncm,qmc,qmc0,qmc3,qmcflac,qmcogg,mflac,qq音乐,网易云音乐,加密" name="keywords"/>
|
<meta content="音乐,解锁,ncm,qmc,qmc0,qmc3,qmcflac,qmcogg,mflac,qq音乐,网易云音乐,加密" name="keywords"/>
|
||||||
<meta content="音乐解锁 - 在任何设备上解锁已购的加密音乐!" name="description"/>
|
<meta content="音乐解锁 - 在任何设备上解锁已购的加密音乐!" name="description"/>
|
||||||
<style>#loader{position:absolute;left:50%;top:50%;z-index:1010;margin:-75px 0 0 -75px;border:16px solid #f3f3f3;border-radius:50%;border-top:16px solid #3498db;width:120px;height:120px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}#loader-mask{position:absolute;width:100%;height:100%;bottom:0;left:0;right:0;top:0;z-index:1009;background-color:rgba(242,246,252,0.88)}</style>
|
<style>#loader {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
z-index: 1010;
|
||||||
|
margin: -75px 0 0 -75px;
|
||||||
|
border: 16px solid #f3f3f3;
|
||||||
|
border-radius: 50%;
|
||||||
|
border-top: 16px solid #3498db;
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
animation: spin 2s linear infinite
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg)
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#loader-mask {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
z-index: 1009;
|
||||||
|
background-color: rgba(242, 246, 252, 0.88)
|
||||||
|
}</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
@ -23,19 +57,31 @@
|
|||||||
src="https://stats.ixarea.com/ixarea-stats/report?idsite=2&rec=1&action_name=音乐解锁+-+By+IXarea"
|
src="https://stats.ixarea.com/ixarea-stats/report?idsite=2&rec=1&action_name=音乐解锁+-+By+IXarea"
|
||||||
style="border:0"/>
|
style="border:0"/>
|
||||||
</noscript>
|
</noscript>
|
||||||
<strong id="tips">音乐解锁采用了一些新特性!建议使用
|
<div hidden id="loader-tips-outdated">
|
||||||
|
<h2>您可能在使用不受支持的<span style="color:#f00;">过时</span>浏览器,这可能导致此应用无法正常工作。</h2>
|
||||||
|
<h3>如果您使用双核浏览器,您可以尝试切换<span style="color:#f00;">“极速模式”</span>解决此问题。</h3>
|
||||||
|
<h3>或者,您可以尝试更换下方的几个浏览器之一。</h3>
|
||||||
|
</div>
|
||||||
|
<h3 hidden id="loader-tips-timeout">
|
||||||
|
音乐解锁采用了一些新特性!建议使用
|
||||||
|
<a href="https://www.microsoftedgeinsider.com/zh-cn/download" target="_blank">Microsoft Edge Chromium</a>
|
||||||
<a href="https://www.google.cn/chrome/" target="_blank">Google Chrome</a>
|
<a href="https://www.google.cn/chrome/" target="_blank">Google Chrome</a>
|
||||||
<a href="https://www.firefox.com.cn/" target="_blank">Mozilla Firefox</a>
|
<a href="https://www.firefox.com.cn/" target="_blank">Mozilla Firefox</a>
|
||||||
<a href="https://www.microsoftedgeinsider.com/zh-cn/download" target="_blank">Microsoft Edge</a>
|
|
||||||
| <a href="https://github.com/ix64/unlock-music/wiki/使用提示" target="_blank">使用提示</a>
|
| <a href="https://github.com/ix64/unlock-music/wiki/使用提示" target="_blank">使用提示</a>
|
||||||
</strong>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
//判断UA以识别浏览器类型
|
setTimeout(function () {
|
||||||
|
var ele = document.getElementById("loader-tips-timeout");
|
||||||
|
if (ele != null) {
|
||||||
|
ele.hidden = false;
|
||||||
|
}
|
||||||
|
}, 2000);
|
||||||
|
|
||||||
var ua = navigator && navigator.userAgent;
|
var ua = navigator && navigator.userAgent;
|
||||||
var orzed = (function () {
|
var detected = (function () {
|
||||||
var m;
|
var m;
|
||||||
if (!ua) return true;
|
if (!ua) return true;
|
||||||
if (/MSIE |Trident\//.exec(ua)) return true; // no IE
|
if (/MSIE |Trident\//.exec(ua)) return true; // no IE
|
||||||
@ -44,24 +90,13 @@
|
|||||||
m = /Chrome\/([\d.]+)/.exec(ua); // Chrome >= 50
|
m = /Chrome\/([\d.]+)/.exec(ua); // Chrome >= 50
|
||||||
if (m && Number(m[1]) < 50) return true;
|
if (m && Number(m[1]) < 50) return true;
|
||||||
m = /Firefox\/([\d.]+)/.exec(ua); // Firefox >= 38
|
m = /Firefox\/([\d.]+)/.exec(ua); // Firefox >= 38
|
||||||
if (m && Number(m[1]) < 38) return true;
|
return m && Number(m[1]) < 38;
|
||||||
|
})();
|
||||||
return false;
|
if (detected) {
|
||||||
|
document.getElementById('loader-tips-outdated').hidden = false;
|
||||||
|
document.getElementById("loader-tips-timeout").hidden = false;
|
||||||
|
}
|
||||||
})();
|
})();
|
||||||
|
|
||||||
//定义输出文本,使用HTML格式
|
|
||||||
var infoHTML =
|
|
||||||
'<h1>您可能在使用不受支持的<b style="color:#f00;">过时</b>浏览器,这会导致加载出现问题。</h1>' +
|
|
||||||
'<h2>如果您使用国产浏览器,请在右上方选择<b style="color:#f00;">“极速模式”</b>,而非“兼容模式”。</h2>' +
|
|
||||||
'<h2>推荐使用基于 Chromium 的最新版本的 <a target="_blank" href="https://www.microsoft.com/zh-cn/windows/microsoft-edge" style="color:#f62;">Microsoft Edge 浏览器</a> 访问本站</h2>' +
|
|
||||||
'<h4>UA调试区:' + ua + '</h4>';
|
|
||||||
|
|
||||||
var elem = document.getElementById('tips');
|
|
||||||
window.browser_orzed = orzed;
|
|
||||||
if (orzed) {
|
|
||||||
elem.innerHTML = infoHTML;
|
|
||||||
};
|
|
||||||
})();
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
Loading…
Reference in New Issue
Block a user