commit 7a40905d5d8b7ad4ed4914f5771c2193df382f5d Author: 底层用户 Date: Sat Sep 25 22:57:18 2021 +0800 first commit diff --git a/css/animation.css b/css/animation.css new file mode 100644 index 0000000..27f3f0c --- /dev/null +++ b/css/animation.css @@ -0,0 +1,89 @@ +/*模糊渐入动画*/ +@keyframes fade-in { + 0% { + opacity: 0; + backdrop-filter: blur(0px); + } + + 100% { + opacity: 1; + backdrop-filter: blur(10px); + } +} + +@-webkit-keyframes fade-in { + 0% { + opacity: 0; + backdrop-filter: blur(0px); + } + + 100% { + opacity: 1; + backdrop-filter: blur(10px); + } +} + +@-moz-keyframes fade-in { + 0% { + opacity: 0; + backdrop-filter: blur(0px); + } + + 100% { + opacity: 1; + backdrop-filter: blur(10px); + } +} + +@-o-keyframes fade-in { + 0% { + opacity: 0; + backdrop-filter: blur(0px); + } + + 100% { + opacity: 1; + backdrop-filter: blur(10px); + } +} + +/*渐入动画*/ +@keyframes fade { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +@-webkit-keyframes fade { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +@-moz-keyframes fade { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +@-o-keyframes fade { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} \ No newline at end of file diff --git a/css/font.css b/css/font.css new file mode 100644 index 0000000..cbd5dd6 --- /dev/null +++ b/css/font.css @@ -0,0 +1,64 @@ +@font-face { + font-family: "iconfont"; + src: url('../font/font_2831425_80aedhvquju.woff2') format('woff2'), + url('../font/font_2831425_80aedhvquju.woff') format('woff'), + url('../font/font_2831425_80aedhvquju.ttf') format('truetype'); +} + +@font-face { + font-family: "Pacifico-Regular"; + src: url('../font/Pacifico-Regular.ttf'); +} + +@font-face { + font-family: "UnidreamLED"; + src: url('../font/UnidreamLED.ttf'); +} + +.iconfont { + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-youxiang:before { + content: "\e605"; +} + +.icon-github:before { + content: "\e691"; +} + +.icon-telegram1:before { + content: "\e731"; +} + +.icon-QQ:before { + content: "\e882"; +} + +.icon-twitter:before { + content: "\e883"; +} + +.icon-github1:before { + content: "\e799"; +} + +.icon-weixin:before { + content: "\e600"; +} + +.icon-telegram:before { + content: "\e8db"; +} + +.icon-yinhao-copy:before { + content: "\e608"; +} + +.icon-yinhao-copy-copy:before { + content: "\e62e"; +} \ No newline at end of file diff --git a/css/loading.css b/css/loading.css new file mode 100644 index 0000000..817cacf --- /dev/null +++ b/css/loading.css @@ -0,0 +1,125 @@ +#loading-box .loading-left-bg, +#loading-box .loading-right-bg { + position: fixed; + z-index: 999998; + width: 50%; + height: 100%; + background-color: rgb(81 81 81 / 80%); + transition: all 0.7s cubic-bezier(0.42, 0, 0, 1.01); + backdrop-filter: blur(40px); +} + +#loading-box .loading-right-bg { + right: 0; +} + +#loading-box>.spinner-box { + position: fixed; + z-index: 999999; + display: flex; + justify-content: center; + align-items: center; + width: 100%; + height: 100vh; +} + +#loading-box .spinner-box .loading-word { + position: absolute; + color: #ffffff; + font-size: 0.95rem; + transform: translateY(64px); + text-align: center; +} + +p.loading-title { + font-size: 1.25rem; + margin: 20px 10px 4px 10px; +} + +#loading-box .spinner-box .configure-core { + width: 100%; + height: 100%; + background-color: #37474f; +} + +div.loaded div.loading-left-bg { + transform: translate(-100%, 0); +} + +div.loaded div.loading-right-bg { + transform: translate(100%, 0); +} + +div.loaded div.spinner-box { + display: none !important; +} + +.loader { + position: absolute; + top: calc(50% - 32px); + left: calc(50% - 32px); + width: 64px; + height: 64px; + border-radius: 50%; + perspective: 800px; + transition: all 0.7s cubic-bezier(0.42, 0, 0, 1.01); +} + +.inner { + position: absolute; + box-sizing: border-box; + width: 100%; + height: 100%; + border-radius: 50%; +} + +.inner.one { + left: 0%; + top: 0%; + animation: rotate-one 1s linear infinite; + border-bottom: 3px solid #EFEFFA; +} + +.inner.two { + right: 0%; + top: 0%; + animation: rotate-two 1s linear infinite; + border-right: 3px solid #EFEFFA; +} + +.inner.three { + right: 0%; + bottom: 0%; + animation: rotate-three 1s linear infinite; + border-top: 3px solid #EFEFFA; +} + +@keyframes rotate-one { + 0% { + transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); + } + + 100% { + transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); + } +} + +@keyframes rotate-two { + 0% { + transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); + } + + 100% { + transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); + } +} + +@keyframes rotate-three { + 0% { + transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); + } + + 100% { + transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); + } +} \ No newline at end of file diff --git a/css/mobile.css b/css/mobile.css new file mode 100644 index 0000000..443cf61 --- /dev/null +++ b/css/mobile.css @@ -0,0 +1,225 @@ +@charset"utf-8"; + +/*小于1400px时*/ +@media (max-width: 1400px) { + + /*时钟显示*/ + span#win_text, + span#win_speed { + display: none; + } +} + +/*小于1200px时*/ +@media (max-width: 1200px) { + + /*总布局*/ + .container, + .container-lg, + .container-md, + .container-sm { + max-width: 1100px !important; + } + + /*天气模块*/ + .weather { + display: none; + } + + .weekday { + display: none; + } +} + +/*小于992px时*/ +@media (max-width: 992px) { + + /*一言*/ + .col.hitokotos { + display: none; + } + + /*日期显示*/ + .weekday { + display: inline; + } + + /*标题文字*/ + .main-img img { + width: 110px; + } + + span.img-title { + font-size: 4.75rem; + } + + span.img-text { + font-size: 1.75rem; + } +} + +/*小于789px时*/ +@media (max-width: 789px) { + + /*标题文字*/ + span.img-text { + display: none; + } +} + +/*小于768px时*/ +@media (max-width: 768px) { + + /*标题文字*/ + .main-img img { + width: 100px; + } + + span.img-title { + font-size: 4.5rem; + } +} + +/*小于660px时*/ +@media (max-width: 660px) { + + /*左侧栏高度*/ + .main-left { + transform: translateY(20px); + } + + /*右侧栏隐藏*/ + .col.right { + display: none; + } + + /*标题文字*/ + span.img-text { + display: inline; + } + + /*简介*/ + .message { + max-width: 100%; + pointer-events: none; + } + + /* + .des { + justify-content: space-between; + } + */ + + /*社交链接*/ + .social { + max-width: 100%; + justify-content: center; + } + + #link-text { + display: none !important; + } + + .link i { + margin: 0px 20px; + } + + /*菜单栏按钮*/ + .menu { + display: flex; + justify-content: center; + position: fixed; + top: 84%; + } + + .munu-button { + padding: 5px 20px; + background: rgb(0 0 0 / 20%); + backdrop-filter: blur(10px); + border-radius: 6px; + font-size: 1.25rem; + transition: 0.5s; + } + + /*页脚文字*/ + footer { + font-size: 0.85rem; + } + +} + +@media (min-width: 660px) { + .menu { + display: none !important; + } +} + +/*小于390px时*/ +@media (max-width: 390px) { + .main-img img { + display: none; + } +} + + +/* +菜单按钮 +*/ +.menus .col.left { + display: none; +} + +.menus .col.right { + display: block !important; + transition: 0.5s; + padding: 0rem 0.75rem; +} + +/*功能区调整*/ +.menus .col.hitokotos { + display: block; +} + +.menus .col.times { + display: none; +} + +/*边界布局*/ +.menus .row { + --bs-gutter-x: 0rem; +} + +.menus .col.\32 { + margin: 0 0.75rem; +} + +.menus .logo { + display: inline !important; + position: fixed; + top: 8%; + font-family: 'Pacifico-Regular'; + font-size: 1.75rem; +} + +/*切换动画*/ +.hitokoto, +.time, +.link-card, +.message { + animation: fade-in 0.5; + -webkit-animation: fade-in 0.5s; + -moz-animation: fade-in 0.5s; + -o-animation: fade-in 0.5s; + -ms-animation: fade-in 0.5s; +} + +.logo, +.line, +.main-img, +.social { + animation: fade 0.5; + -webkit-animation: fade 0.5s; + -moz-animation: fade 0.5s; + -o-animation: fade 0.5s; + -ms-animation: fade 0.5s; +} \ No newline at end of file diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..49091a3 --- /dev/null +++ b/css/style.css @@ -0,0 +1,287 @@ +@charset"utf-8"; +/*全局样式*/ +html, +body { + width: 100%; + height: 100%; + margin: 0; + padding: 0; +} + +*, +a, +p { + text-decoration: none; + transition: 0.3s; + color: #efefef; + user-select: none; +} + +a:hover { + color: white; +} + +.cards { + transition: 0.5s; +} + +.cards:hover { + transform: scale(1.01); + transition: 0.5s; +} + +.cards:active { + transform: scale(0.95); + transition: 0.5s; +} + +/*页面样式*/ +section { + display: block; + position: fixed; + width: 100%; + height: 100%; +} + +main { + width: 100%; + height: 100%; + background: rgb(0 0 0 / 20%); + display: flex; + /*align-items: center;*/ +} + +.container { + width: 100%; + display: flex; + justify-content: space-around; +} + +.row { + align-items: center; + width: 100%; +} + +.main-left { + /*transform: translateY(240px);*/ + transform: translateY(40px); +} +/* +.main-right { + transform: translateY(38%); +} +*/ +.row.rightone { + display: flex; + align-items: center; +} + +/*头像*/ +.main-img { + display: flex; + align-items: center; +} + +.main-img img { + border-radius: 50%; + width: 120px; +} + +.img-title { + width: 100%; + margin-left: 12px; + font-family: Pacifico-Regular; + transform: translateY(-8%); +} + +span.img-title { + font-size: 5rem; +} + +span.img-text { + font-size: 2rem; +} + +/*简介*/ +.message { + background: rgb(0 0 0 / 25%); + backdrop-filter: blur(10px); + /*margin: 0.5rem;*/ + padding: 1rem; + border-radius: 6px; + margin-top: 3.5rem; + max-width: 460px; +} + +.des { + display: flex; + justify-content: space-between; +} + +p.des-title { + margin: 1rem 1rem; + line-height: 2rem; + font-family: Pacifico-Regular; +} + +i.iconfont.icon-yinhao-copy { + align-self: flex-end; +} + +/*社交链接*/ +.social { + margin-top: 1rem; + display: flex; + align-items: center; + max-width: 460px; +} + +.link i { + font-size: 1.75rem; + margin: 0px 10px; +} + +#link-text { + display: none; + flex: 1; + text-align: right; + margin-right: 1rem; +} + +/*一言*/ +.hitokoto { + width: 100%; + background: rgb(0 0 0 / 25%); + backdrop-filter: blur(10px); + padding: 20px; + border-radius: 6px; +} + +.hitokoto-all { + margin-top: 10px; + display: flex; + flex-direction: column; +} + +.hitokoto-from { + margin-top: 10px; + font-weight: bold; + align-self: flex-end; +} + +/*时间卡片*/ +.time { + width: 100%; + background: rgb(0 0 0 / 25%); + backdrop-filter: blur(10px); + padding: 20px; + border-radius: 6px; + text-align: center; + display: flex; + flex-direction: column; +} + +span.time-text { + font-size: 3.25rem; + letter-spacing: 2px; + font-family: UnidreamLED; +} + +/*链接卡片*/ +.line { + margin: 1rem 0.25rem; + margin-top: 2rem; + font-size: 1.10rem; +} + +.link-card { + height: 100px; + width: 100%; + border-radius: 6px; + background: rgb(0 0 0 / 25%); + backdrop-filter: blur(10px); + display: flex; + align-items: center; + flex-direction: column; + justify-content: space-evenly; +} + +.link-card:hover { + background: rgb(0 0 0 / 40%); + transition: 0.5s; +} + +/*更多页面*/ +.more { + display: none; + width: 46%; + z-index: 999; + position: fixed; + height: 82%; + right: 4%; + background: rgb(0 0 0 / 25%); + backdrop-filter: blur(10px); + top: 7%; + border-radius: 6px; + padding: 20px; +} + +.mores .more { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + animation: fade; + -webkit-animation: fade 0.3s; + -moz-animation: fade 0.3s; + -o-animation: fade 0.3s; + -ms-animation: fade 0.3s; +} + +i.fad.fa-comment-alt-dots { + font-size: 2.75rem; +} + +.mores .col.right { + display: none; +} + +/*页脚样式*/ +footer { + text-align: center; + height: 46px; + backdrop-filter: blur(10px); + background: rgb(0 0 0 / 25%); +} + +.power { + line-height: 46px; + opacity: 0.8; +} + +/*弹窗样式*/ +.iziToast { + background: rgb(0 0 0 / 45%) !important; + backdrop-filter: blur(10px) !important; +} + +.iziToast-body .iziToast-message { + line-height: 18px !important; +} + +.iziToast:after { + box-shadow: none !important; +} + +.iziToast-message.slideIn { + margin-top: 5px !important; +} + +.iziToast-message { + word-break: break-all !important; +} + +.iziToast>.iziToast-close { + background: url(https://cdn.jsdelivr.net/gh/imsyy/file/pic/close.png) no-repeat 50% 50% !important; + background-size: 8px !important; +} \ No newline at end of file diff --git a/favicon.ico b/favicon.ico new file mode 100644 index 0000000..d67c430 Binary files /dev/null and b/favicon.ico differ diff --git a/font/Pacifico-Regular.ttf b/font/Pacifico-Regular.ttf new file mode 100644 index 0000000..b9265a2 Binary files /dev/null and b/font/Pacifico-Regular.ttf differ diff --git a/font/UnidreamLED.ttf b/font/UnidreamLED.ttf new file mode 100644 index 0000000..cc0a4b0 Binary files /dev/null and b/font/UnidreamLED.ttf differ diff --git a/font/font_2831425_80aedhvquju.ttf b/font/font_2831425_80aedhvquju.ttf new file mode 100644 index 0000000..d4272f5 Binary files /dev/null and b/font/font_2831425_80aedhvquju.ttf differ diff --git a/font/font_2831425_80aedhvquju.woff b/font/font_2831425_80aedhvquju.woff new file mode 100644 index 0000000..01b0741 Binary files /dev/null and b/font/font_2831425_80aedhvquju.woff differ diff --git a/font/font_2831425_80aedhvquju.woff2 b/font/font_2831425_80aedhvquju.woff2 new file mode 100644 index 0000000..244bf0a Binary files /dev/null and b/font/font_2831425_80aedhvquju.woff2 differ diff --git a/img/apple-touch-icon.png b/img/apple-touch-icon.png new file mode 100644 index 0000000..d2c821d Binary files /dev/null and b/img/apple-touch-icon.png differ diff --git a/img/background.png b/img/background.png new file mode 100644 index 0000000..f69190b Binary files /dev/null and b/img/background.png differ diff --git a/img/favicon.ico b/img/favicon.ico new file mode 100644 index 0000000..918e412 Binary files /dev/null and b/img/favicon.ico differ diff --git a/img/logo.png b/img/logo.png new file mode 100644 index 0000000..d2c821d Binary files /dev/null and b/img/logo.png differ diff --git a/img/weixin.png b/img/weixin.png new file mode 100644 index 0000000..81f015e Binary files /dev/null and b/img/weixin.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..5c936c4 --- /dev/null +++ b/index.html @@ -0,0 +1,239 @@ + + + + + + + + + + + + + + + 無名の主页 + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+ img +
+ imsyy + .top +
+
+ +
+
+

Hello World !
一个建立于 21 世纪的小站，存活于互联网的边缘

+ +
+
+ + +
+
+
+
+ +
+
+ +
+
 一言
+
+
每一个人都应该明确自己的方向和位置 +
+
-「 無名 」 +
+
+
+
+
+ +
+
+
+ 天气 加载失败 *°C~*°C 风向* +
+
+
+
+ +
+ + 网站列表 +
+ +
+ +
+
+ +
+ + 博客 +
+ +
+
+ +
+ + 网址导航 +
+ +
+
+ +
+ + 音乐 +
+ +
+
+ +
+
+ +
+ + 实验室 +
+ +
+
+ +
+ + 网盘 +
+ +
+
+ +
+ + 关于 +
+ +
+
+
+
+
+
+ +
+ +
+ + + +
+ +

还没想好要写些啥

+
+
+
+
+
Copyright © 2020 +  無名 | 豫ICP备20013231-2号 +
+
+
+ + + + + + \ No newline at end of file diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..2143802 --- /dev/null +++ b/js/main.js @@ -0,0 +1,215 @@ +//弹窗样式 +iziToast.settings({ + timeout: 10000, + icon: 'Fontawesome', + closeOnEscape: 'true', + position: 'topLeft', + transitionIn: 'bounceInRight', + transitionOut: 'fadeOutLeft', + displayMode: '2', + layout: '2', + titleColor: '#efefef', + messageColor: '#efefef', + iconColor: '#efefef', +}); + +iziToast.info({ + icon: 'fad fa-vial', + title: '新版站点试运行', + message: '还存在亿些小问题 ~ 返回旧版' +}); + +//获取一言 +fetch('https://v1.hitokoto.cn') + .then(response => response.json()) + .then(data => { + const hitokoto = document.getElementById('hitokoto_text') + const from = document.getElementById('from_text') + hitokoto.innerText = data.hitokoto + from.innerText = data.from + }) + .catch(console.error) + +//获取天气 +fetch('https://www.tianqiapi.com/free/day?appid=43986679&appsecret=TksqGZT7') + .then(response => response.json()) + .then(data => { + const wea = document.getElementById('wea_text') + const city = document.getElementById('city_text') + const tem_night = document.getElementById('tem_night') + const tem_day = document.getElementById('tem_day') + const win = document.getElementById('win_text') + const win_speed = document.getElementById('win_speed') + wea.innerText = data.wea + city.innerText = data.city + tem_night.innerText = data.tem_night + tem_day.innerText = data.tem_day + win.innerText = data.win + win_speed.innerText = data.win_speed + }) + .catch(console.error) + +//获取时间 +var t = null; +t = setTimeout(time, 1000); + +function time() { + clearTimeout(t); + dt = new Date(); + var y = dt.getYear() + 1900; + var mm = dt.getMonth() + 1; + var d = dt.getDate(); + var weekday = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]; + var day = dt.getDay(); + var h = dt.getHours(); + var m = dt.getMinutes(); + var s = dt.getSeconds(); + if (h < 10) { + h = "0" + h; + } + if (m < 10) { + m = "0" + m; + } + if (s < 10) { + s = "0" + s; + } + document.getElementById("time").innerHTML = y + " 年 " + mm + " 月 " + d + " 日 " + "" + weekday[day] + "
" + "" + h + ":" + m + ":" + s + ""; + t = setTimeout(time, 1000); +} + +//必应壁纸 +var url = 'https://bird.ioliu.cn/v1/?url=https://www.bing.com/HPImageArchive.aspx?format=js&idx=0&n=8'; +var imgUrls = JSON.parse(sessionStorage.getItem("imgUrls")); +var index = sessionStorage.getItem("index"); +var $section = $('#section'); +if (imgUrls == null) { + imgUrls = new Array(); + index = 0; + $.get(url, function (result) { + images = result.images; + for (let i = 0; i < images.length; i++) { + const item = images[i]; + imgUrls.push(item.url); + } + var imgUrl = imgUrls[index]; + var url = "https://www.bing.com" + imgUrl; + $section.css("background", "url('" + url + "') center center no-repeat #666"); + $section.css("background-size", "cover"); + sessionStorage.setItem("imgUrls", JSON.stringify(imgUrls)); + sessionStorage.setItem("index", index); + }); +} else { + if (index == 7) + index = 0; + else + index++; + var imgUrl = imgUrls[index]; + var url = "https://www.bing.com" + imgUrl; + $section.css("background", "url('" + url + "') center center no-repeat #666"); + $section.css("background-size", "cover"); + sessionStorage.setItem("index", index); +} + +//加载动画 +window.addEventListener('load', function () { + document.body.style.overflow = 'auto'; + document.getElementById('loading-box').classList.add("loaded") +}, false) + +//链接提示文字 +window.onload = function () { + var link = document.getElementById("social"); + link.onmouseover = function () { + document.getElementById("social").style.cssText = "background: rgb(0 0 0 / 25%);backdrop-filter: blur(5px);border-radius: 6px;transition: all 0.5s"; + document.getElementById("link-text").style.cssText = "display: block;transition: all 0.5s"; + }; + link.onmouseout = function () { + document.getElementById("social").style.cssText = "background: none;backdrop-filter: none;border-radius: 6px;transition: all 0.5s"; + document.getElementById("link-text").style.cssText = "display: none;transition: all 0.5s"; + } + + var link = document.getElementById("github"); + link.onmouseover = function () { + document.getElementById("link-text").innerHTML = "去 Github 看看"; + }; + link.onmouseout = function () { + document.getElementById("link-text").innerHTML = "通过这里联系我"; + } + var link1 = document.getElementById("qq"); + link1.onmouseover = function () { + document.getElementById("link-text").innerHTML = "有什么事吗"; + }; + link1.onmouseout = function () { + document.getElementById("link-text").innerHTML = "通过这里联系我"; + } + var link2 = document.getElementById("email"); + link2.onmouseover = function () { + document.getElementById("link-text").innerHTML = "来封 Email"; + }; + link2.onmouseout = function () { + document.getElementById("link-text").innerHTML = "通过这里联系我"; + } + var link3 = document.getElementById("telegram"); + link3.onmouseover = function () { + document.getElementById("link-text").innerHTML = "你懂的 ~"; + }; + link3.onmouseout = function () { + document.getElementById("link-text").innerHTML = "通过这里联系我"; + } + var link4 = document.getElementById("twitter"); + link4.onmouseover = function () { + document.getElementById("link-text").innerHTML = "你懂的 ~"; + }; + link4.onmouseout = function () { + document.getElementById("link-text").innerHTML = "通过这里联系我"; + } +}; + +//菜单栏切换 +function switchMenu() { + var menu = document.cookie.replace(/(?:(?:^|.*;\s*)menu\s*\=\s*([^;]*).*$)|^.*$/, "$1") || '0'; + if (menu == '0') { + document.getElementById("container").classList.add('menus'); + document.getElementById("menu").innerHTML = ""; + document.cookie = "menu=1;path=/"; + } else { + document.getElementById("container").classList.remove('menus'); + document.getElementById("menu").innerHTML = ""; + document.cookie = "menu=0;path=/"; + } +} + +//更多页面切换 +function switchMore() { + var more = document.cookie.replace(/(?:(?:^|.*;\s*)more\s*\=\s*([^;]*).*$)|^.*$/, "$1") || '0'; + if (more == '0') { + document.getElementById("container").classList.add('mores'); + document.getElementById("change").innerHTML = "Oops !"; + document.getElementById("change1").innerHTML = "哎呀，这都被你发现了（ 再点击一次可关闭 ）"; + document.cookie = "more=1;path=/"; + } else { + document.getElementById("container").classList.remove('mores'); + document.getElementById("change").innerHTML = "Hello World !"; + document.getElementById("change1").innerHTML = "一个建立于 21 世纪的小站，存活于互联网的边缘"; + document.cookie = "more=0;path=/"; + } +} + +//监听网页宽度 +window.addEventListener('load', function () { + //console.log(window.innerWidth); + window.addEventListener('resize', function () { + //console.log(window.innerWidth); + //关闭移动端样式 + if (window.innerWidth >= 600) { + document.getElementById("container").classList.remove('menus'); + } + //移动端隐藏更多页面 + if (window.innerWidth <= 660) { + document.getElementById("container").classList.remove('mores'); + document.getElementById("change").innerHTML = "Hello World !"; + document.getElementById("change1").innerHTML = "一个建立于 21 世纪的小站，存活于互联网的边缘"; + } + }) + +}) \ No newline at end of file diff --git a/js/music.js b/js/music.js new file mode 100644 index 0000000..fa2d776 --- /dev/null +++ b/js/music.js @@ -0,0 +1,283 @@ +function aplayer() { + const ap = new APlayer({ + container: document.getElementById('aplayer'), + order: 'random', + preload: 'auto', + volume: 0.5, + mutex: true, + listFolded: true, lrcType: 3, + audio: [{ + name: 'Mojito', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-Mojito.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M0000009C3rp3Kfwg0_3.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-Mojito.lrc', + theme: '#3fbce8' + }, + { + name: '夜曲', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E5%A4%9C%E6%9B%B2.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M0000024bjiL2aocxT_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E5%A4%9C%E6%9B%B2.lrc', + theme: '#171513' + }, + { + name: '发如雪', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E5%8F%91%E5%A6%82%E9%9B%AA.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M0000024bjiL2aocxT_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E5%8F%91%E5%A6%82%E9%9B%AA.lrc', + theme: '#171513' + }, + { + name: '稻香', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%A8%BB%E9%A6%99.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002Neh8l0uciQZ_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%A8%BB%E9%A6%99.lrc', + theme: '#e3ae55' + }, + { + name: '七里香', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E4%B8%83%E9%87%8C%E9%A6%99.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000003DFRzD192KKD_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E4%B8%83%E9%87%8C%E9%A6%99.lrc', + theme: '#395732' + }, + { + name: '晴天', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E6%99%B4%E5%A4%A9.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000000MkMni19ClKG_3.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E6%99%B4%E5%A4%A9.lrc', + theme: '#08362e' + }, + { + name: '以父之名', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E4%BB%A5%E7%88%B6%E4%B9%8B%E5%90%8D.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000000MkMni19ClKG_3.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E4%BB%A5%E7%88%B6%E4%B9%8B%E5%90%8D.lrc', + theme: '#08362e' + }, + { + name: '本草纲目', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E6%9C%AC%E8%8D%89%E7%BA%B2%E7%9B%AE.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002jLGWe16Tf1H_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E6%9C%AC%E8%8D%89%E7%BA%B2%E7%9B%AE.lrc', + theme: '#171513' + }, + { + name: '简单爱', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%AE%80%E5%8D%95%E7%88%B1.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000000I5jJB3blWeN_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%AE%80%E5%8D%95%E7%88%B1.lrc', + theme: '#c21c0f' + }, + { + name: '青花瓷', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E9%9D%92%E8%8A%B1%E7%93%B7.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002eFUFm2XYZ7z_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E9%9D%92%E8%8A%B1%E7%93%B7.lrc', + theme: '#000000' + }, + { + name: '烟花易冷', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%83%9F%E8%8A%B1%E6%98%93%E5%86%B7.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000000bviBl4FjTpO_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%83%9F%E8%8A%B1%E6%98%93%E5%86%B7.lrc', + theme: '#86b5bb' + }, + { + name: '给我一首歌的时间', + artist: '周杰伦', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%BB%99%E6%88%91%E4%B8%80%E9%A6%96%E6%AD%8C%E7%9A%84%E6%97%B6%E9%97%B4.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002Neh8l0uciQZ_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6-%E7%BB%99%E6%88%91%E4%B8%80%E9%A6%96%E6%AD%8C%E7%9A%84%E6%97%B6%E9%97%B4.lrc', + theme: '#e3ae55' + }, + { + name: '千里之外', + artist: '周杰伦 / 费玉清', + url: 'https://file.imsyy.top/music/songs/%E5%91%A8%E6%9D%B0%E4%BC%A6%26%E8%B4%B9%E7%8E%89%E6%B8%85-%E5%8D%83%E9%87%8C%E4%B9%8B%E5%A4%96.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002jLGWe16Tf1H_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E5%91%A8%E6%9D%B0%E4%BC%A6%26%E8%B4%B9%E7%8E%89%E6%B8%85-%E5%8D%83%E9%87%8C%E4%B9%8B%E5%A4%96.lrc', + theme: '#171513' + }, + { + name: '单车', + artist: '陈奕迅', + url: 'https://file.imsyy.top/music/songs/%E9%99%88%E5%A5%95%E8%BF%85-%E5%8D%95%E8%BD%A6.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000004S8YQr3UmEbG_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E9%99%88%E5%A5%95%E8%BF%85-%E5%8D%95%E8%BD%A6i.lrc', + theme: '#32201f' + }, + { + name: '浮夸', + artist: '陈奕迅', + url: 'https://file.imsyy.top/music/songs/%E9%99%88%E5%A5%95%E8%BF%85-%E6%B5%AE%E5%A4%B8.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000003J6fvc0bVJon_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E9%99%88%E5%A5%95%E8%BF%85-%E6%B5%AE%E5%A4%B8.lrc', + theme: '#040402' + }, + { + name: '十年', + artist: '陈奕迅', + url: 'https://file.imsyy.top/music/songs/%E9%99%88%E5%A5%95%E8%BF%85-%E6%B5%AE%E5%A4%B8.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000003J6fvc0bVJon_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E9%99%88%E5%A5%95%E8%BF%85-%E6%B5%AE%E5%A4%B8.lrc', + theme: '#040402' + }, + { + name: '一丝不挂', + artist: '陈奕迅', + url: 'https://file.imsyy.top/music/songs/%E9%99%88%E5%A5%95%E8%BF%85-%E4%B8%80%E4%B8%9D%E4%B8%8D%E6%8C%82.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000001sjRhH0wqa4Q_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E9%99%88%E5%A5%95%E8%BF%85-%E4%B8%80%E4%B8%9D%E4%B8%8D%E6%8C%82.lrc', + theme: '#0d0d0d' + }, + { + name: '麻雀', + artist: '李荣浩', + url: 'https://file.imsyy.top/music/songs/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E9%BA%BB%E9%9B%80.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000003P3ByD1n8nBK_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E9%BA%BB%E9%9B%80.lrc', + theme: '#849fbd' + }, + { + name: '老街', + artist: '李荣浩', + url: 'https://file.imsyy.top/music/songs/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E8%80%81%E8%A1%97.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000001LP8hk0a6pOp_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E8%80%81%E8%A1%97.lrc', + theme: '#e0d7bb' + }, + { + name: '年少有为', + artist: '李荣浩', + url: 'https://file.imsyy.top/music/songs/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E5%B9%B4%E5%B0%91%E6%9C%89%E4%B8%BA.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000000RLvtE1eDyOs_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E5%B9%B4%E5%B0%91%E6%9C%89%E4%B8%BA.lrc', + theme: '#d2ddd5' + }, + { + name: '爸爸妈妈', + artist: '李荣浩', + url: 'https://file.imsyy.top/music/songs/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E7%88%B8%E7%88%B8%E5%A6%88%E5%A6%88.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000001fi1zG0EjU2u_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E6%9D%8E%E8%8D%A3%E6%B5%A9-%E7%88%B8%E7%88%B8%E5%A6%88%E5%A6%88.lrc', + theme: '#aec3ce' + }, + { + name: '干杯', + artist: '五月天', + url: 'https://file.imsyy.top/music/songs/%E4%BA%94%E6%9C%88%E5%A4%A9-%E5%B9%B2%E6%9D%AF.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000001fbipy4azgKM_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E4%BA%94%E6%9C%88%E5%A4%A9-%E5%B9%B2%E6%9D%AF.lrc', + theme: '#0f1e32' + }, + { + name: '倔强', + artist: '五月天', + url: 'https://file.imsyy.top/music/songs/%E4%BA%94%E6%9C%88%E5%A4%A9-%E5%80%94%E5%BC%BA.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M0000006MmDz4Hl2Ud_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E4%BA%94%E6%9C%88%E5%A4%A9-%E5%80%94%E5%BC%BA.lrc', + theme: '#b3dae1' + }, + { + name: '你不是真正的快乐', + artist: '五月天', + url: 'https://file.imsyy.top/music/songs/%E4%BA%94%E6%9C%88%E5%A4%A9-%E4%BD%A0%E4%B8%8D%E6%98%AF%E7%9C%9F%E6%AD%A3%E7%9A%84%E5%BF%AB%E4%B9%90.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M0000020I7sO0ayXhN_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E4%BA%94%E6%9C%88%E5%A4%A9-%E4%BD%A0%E4%B8%8D%E6%98%AF%E7%9C%9F%E6%AD%A3%E7%9A%84%E5%BF%AB%E4%B9%90.lrc', + theme: '#0a0708' + }, + { + name: '派对动物', + artist: '五月天', + url: 'https://file.imsyy.top/music/songs/%E4%BA%94%E6%9C%88%E5%A4%A9-%E6%B4%BE%E5%AF%B9%E5%8A%A8%E7%89%A9.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002fRO0N4FftzY_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/%E4%BA%94%E6%9C%88%E5%A4%A9-%E6%B4%BE%E5%AF%B9%E5%8A%A8%E7%89%A9.lrc', + theme: '#d0e8f2' + }, + { + name: 'Jackpot', + artist: 'TheFatRat', + url: 'https://file.imsyy.top/music/songs/TheFatRat-Jackpot.mp3', + cover: 'https://p2.music.126.net/MoyUJHTq1RcFvGy3N3Ooxg==/18596040161820969.jpg?param=130y130', + lrc: 'https://file.imsyy.top/music/lrc/music.lrc', + theme: '#813D25' + }, + { + name: 'All About Us', + artist: 'He Is We / Owl City', + url: 'https://file.imsyy.top/music/songs/He%20Is%20We%26Owl%20City-All%20About%20Us.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000004b2Efp2dEWlo_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/He%20Is%20We%26Owl%20City-All%20About%20Us.lrc', + theme: '#ee5a75' + }, + { + name: 'You\'re Not Alone', + artist: 'Owl City / Britt Nicole', + url: 'https://file.imsyy.top/music/songs/Owl%20City%26Britt%20Nicole-You\'re%20Not%20Alone.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002ke9Cq3KeWYj_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/Owl%20City%26Britt%20Nicole-You\'re%20Not%20Alone.lrc', + theme: '#eff8fa' + }, + { + name: 'Good Time', + artist: 'Owl City / Carly Rae Jepsen', + url: 'https://file.imsyy.top/music/songs/Owl%20City%26Carly%20Rae%20Jepsen-Good%20Time.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000001mat8F3tAzsu_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/Owl%20City%26Carly%20Rae%20Jepsen-Good%20Time.lrc', + theme: '#dd111c' + }, + { + name: 'Unbelievable', + artist: 'Owl City / Hanson', + url: 'https://file.imsyy.top/music/songs/Owl%20City%26Hanson-Unbelievable.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000004O8zk80vaqfl_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/Owl%20City%26Hanson-Unbelievable.lrc', + theme: '#de7227' + }, + { + name: 'Fireflies', + artist: 'Owl City', + url: 'https://file.imsyy.top/music/songs/Owl%20City-Fireflies.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002FEF7L03Cv7T_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/Owl%20City-Fireflies.lrc', + theme: '#33658d' + }, + { + name: 'Gold', + artist: 'Owl City', + url: 'https://file.imsyy.top/music/songs/Owl%20City-Gold.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000001Y76KO1Vpg7b_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/Owl%20City-Gold.lrc', + theme: '#94c1de' + }, + { + name: 'The Saltwater Room', + artist: 'Owl City', + url: 'https://file.imsyy.top/music/songs/Owl%20City-The%20Saltwater%20Room.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M000002FEF7L03Cv7T_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/Owl%20City-The%20Saltwater%20Room.lrc', + theme: '#33658d' + }, + { + name: 'When Can I See You Again？', + artist: 'Owl City', + url: 'https://file.imsyy.top/music/songs/Owl%20City-When%20Can%20I%20See%20You%20Again%EF%BC%9F.mp3', + cover: 'https://y.gtimg.cn/music/photo_new/T002R300x300M0000034UcqG3UwYdy_1.jpg?max_age=2592000', + lrc: 'https://file.imsyy.top/music/lrc/Owl%20City-When%20Can%20I%20See%20You%20Again%EF%BC%9F.lrc', + theme: '#0e1c3a' + } + ] + }); +} \ No newline at end of file diff --git a/upgrade-your-browser/css/support.style.css b/upgrade-your-browser/css/support.style.css new file mode 100644 index 0000000..cb87c28 --- /dev/null +++ b/upgrade-your-browser/css/support.style.css @@ -0,0 +1,58 @@ +/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */ +html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0} +*, ::after, ::before {box-sizing: border-box;} + +a{text-decoration:none;color:#0072c6;}a:hover{text-decoration:none;color:#004d8c;} +body{text-align:center;font-size:14px;line-height:24px;font-family:Microsoft YaHei, '宋体', sans-serif;color:#454545;overflow-y:scroll;_overflow-y:auto;*overflow-y:auto} +.page{width:960px;margin:0 auto;padding:10px;text-align:left;} +h2,h3{font-family:Microsoft YaHei} +h1{font-size:40px;line-height:60px;font-weight:100;margin:20px 0 15px;} +h2{font-size:20px;line-height:25px;font-weight:100;margin:10px 0;} +h3{font-weight:bold} + +code{padding: 2px 4px;font-size: 95%;color: #c7254e;background-color: #f9f2f4;border-radius: 4px;} +pre code{white-space: pre-wrap;word-break:break-word;display:inline-block;word-break:break-all;} +ul{padding:0 1em;} +ul li{list-style-type:disc;list-style-position:inside;} + +b,strong{font-weight:bold} +em{color:red} + +p{margin-bottom:10px} +hr, .hr{margin:20px 0;border:0;width:100%;height:1px;overflow:hidden;background-color:#ccc} + +.text-right{text-align:right} +.clearboth{clear:both;width:100%;content: "";} +.clearleft{clear:left;width:100%;content: "";} +.clearright{clear:right;width:100%;content: "";} + +.browser-list{margin:16px 0 10px;padding:0;height:42px;_overflow:hidden} +.browser{display:block;width:155px;height:34px;line-height:22px;float:left;list-style:none;} +.browser.clearleft{height:1px} +.browser span{display:block;font-size:12px;line-height:1.2;} +.browser img{width:34px;height:34px;border:0;float:left;margin-right:10px;} +.browser.firefox{width:150px} +.browser.edge{width:150px} +.browser.safari{width:150px} +.browser.se360{width:160px} +.browser.qqbrowser{width:140px} +.small-alert{font-size:12px;margin:15px 0 8px;color:#90949c} +.small-alert:not(.hide)+hr{margin-top:0} +.hide{display:none} +.alert-danger{display:block;color:#777;background-color:#f1f1f1;padding:6px 12px;_padding:8px 12px 6px;clear:both;} +.alert-info{color:#000;background-color:#f1f6fc;margin-top:12px} +.alert-info img{vertical-align:text-top;} +#win-danger{margin-top:12px;position: relative;} +#win-danger .arrow{background:url(/images/arrow.png) no-repeat;border:0;position:absolute;display:block;width:20px;height:12px;left:325px;top:-12px} + +.targetline, #referrer a{word-break:break-all;} +.top-alert {background:#f2f2f2;} +.top-alert-content {font-size:14px;} + +@media only screen and (max-width: 959px) { +.page {max-width:100%;padding:20px;font-size:16px;line-height:26px;} +h1 {font-size:26px;line-height:1.8;font-weight:bold;margin-top:0} +.browser-list {height:auto} +.browser {margin:0 20px 20px 0} +code {word-break: break-word;} +} diff --git a/upgrade-your-browser/end-of-ie-support/css/support.style.css b/upgrade-your-browser/end-of-ie-support/css/support.style.css new file mode 100644 index 0000000..cb87c28 --- /dev/null +++ b/upgrade-your-browser/end-of-ie-support/css/support.style.css @@ -0,0 +1,58 @@ +/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */ +html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0} +*, ::after, ::before {box-sizing: border-box;} + +a{text-decoration:none;color:#0072c6;}a:hover{text-decoration:none;color:#004d8c;} +body{text-align:center;font-size:14px;line-height:24px;font-family:Microsoft YaHei, '宋体', sans-serif;color:#454545;overflow-y:scroll;_overflow-y:auto;*overflow-y:auto} +.page{width:960px;margin:0 auto;padding:10px;text-align:left;} +h2,h3{font-family:Microsoft YaHei} +h1{font-size:40px;line-height:60px;font-weight:100;margin:20px 0 15px;} +h2{font-size:20px;line-height:25px;font-weight:100;margin:10px 0;} +h3{font-weight:bold} + +code{padding: 2px 4px;font-size: 95%;color: #c7254e;background-color: #f9f2f4;border-radius: 4px;} +pre code{white-space: pre-wrap;word-break:break-word;display:inline-block;word-break:break-all;} +ul{padding:0 1em;} +ul li{list-style-type:disc;list-style-position:inside;} + +b,strong{font-weight:bold} +em{color:red} + +p{margin-bottom:10px} +hr, .hr{margin:20px 0;border:0;width:100%;height:1px;overflow:hidden;background-color:#ccc} + +.text-right{text-align:right} +.clearboth{clear:both;width:100%;content: "";} +.clearleft{clear:left;width:100%;content: "";} +.clearright{clear:right;width:100%;content: "";} + +.browser-list{margin:16px 0 10px;padding:0;height:42px;_overflow:hidden} +.browser{display:block;width:155px;height:34px;line-height:22px;float:left;list-style:none;} +.browser.clearleft{height:1px} +.browser span{display:block;font-size:12px;line-height:1.2;} +.browser img{width:34px;height:34px;border:0;float:left;margin-right:10px;} +.browser.firefox{width:150px} +.browser.edge{width:150px} +.browser.safari{width:150px} +.browser.se360{width:160px} +.browser.qqbrowser{width:140px} +.small-alert{font-size:12px;margin:15px 0 8px;color:#90949c} +.small-alert:not(.hide)+hr{margin-top:0} +.hide{display:none} +.alert-danger{display:block;color:#777;background-color:#f1f1f1;padding:6px 12px;_padding:8px 12px 6px;clear:both;} +.alert-info{color:#000;background-color:#f1f6fc;margin-top:12px} +.alert-info img{vertical-align:text-top;} +#win-danger{margin-top:12px;position: relative;} +#win-danger .arrow{background:url(/images/arrow.png) no-repeat;border:0;position:absolute;display:block;width:20px;height:12px;left:325px;top:-12px} + +.targetline, #referrer a{word-break:break-all;} +.top-alert {background:#f2f2f2;} +.top-alert-content {font-size:14px;} + +@media only screen and (max-width: 959px) { +.page {max-width:100%;padding:20px;font-size:16px;line-height:26px;} +h1 {font-size:26px;line-height:1.8;font-weight:bold;margin-top:0} +.browser-list {height:auto} +.browser {margin:0 20px 20px 0} +code {word-break: break-word;} +} diff --git a/upgrade-your-browser/end-of-ie-support/index.html b/upgrade-your-browser/end-of-ie-support/index.html new file mode 100644 index 0000000..b75420c --- /dev/null +++ b/upgrade-your-browser/end-of-ie-support/index.html @@ -0,0 +1,62 @@ + + + + + + + + + + 对旧版 Internet Explorer 的支持服务已终止 + + + + + + + + + + + +
+
+
本页是 IE 旧版支持服务终止页面的文字副本，因微软官方网页无法在旧版IE中正常访问，故提供此备份以供旧版IE用户浏览。查看原网页 +
+
+
+
+

对旧版 Internet Explorer 的支持服务已终止

+

从 2016 年 1 月 12 日开始，仅面向受支持操作系统的最新版 Internet Explorer 将收到技术支持和安全更新。Internet Explorer 11 是最新版的 Internet + Explorer，将继续在 Windows 7、Windows 8.1 和 Windows 10 上收到安全更新、兼容性修复程序和技术支持。

+
+

这意味着什么？

+

这意味着您应该采取行动。2016 年 1 月 12 日之后，Microsoft 将不再为 Internet Explorer + 早期版本提供安全更新或技术支持。安全更新用于修补可能被恶意软件利用的漏洞，从而为提高用户及其数据的安全性提供帮助。定期安全更新帮助保护计算机不受恶意攻击，因此升级和保持最新很重要。

+
+

我如何升级 Internet Explorer？

+

中小型企业：对于考虑浏览器升级的中小型企业，选择有很多。没有 Web 应用程序的中小型组织（员工在 500 人以下）可使用自动更新进行自动更新。对于依赖现有 Web + 应用程序的中小型企业，可以寻找 Microsoft 认证合作伙伴以了解符合其业务需要的最佳方案。

+

企业客户：Microsoft 为大型组织（员工在 500 人以上）提供丰富的技术资源、工具和专家指导，以帮助这些组织轻松部署和管理 Windows、Office 以及 Internet + Explorer 产品和技术。通过联系您的 Microsoft 销售代表、Microsoft Services 部门或 Microsoft 认证合作伙伴，详细了解迁移和部署计划。了解如何通过访问 TechNet + 自行试用和部署最新版本的 Edge。

+
+

使用 Internet Explorer 早期版本的潜在风险

+

2016 年 1 月 12 日后运行 Internet Explorer 早期版本可能使您面临潜在风险，例如：

+

安全性：没有关键的浏览器安全更新，您的 PC 可能易受有害病毒、间谍软件和其他恶意软件的攻击，它们可以窃取或损害您的业务数据和信息。

+

合规性：需要遵守法规规定（如 HIPAA）的企业应执行尽职调查，以评估它们使用不受支持的软件是否仍能满足合规性要求。

+

缺乏独立软件 (ISV) 支持：许多独立软件供应商 (ISV) 都不再支持 Internet Explorer 早期版本。例如，Office 365 采用现代 Web + 标准，而且与最新浏览器一起使用时运行最出色。

+
+

Copyright © 2020 無名 . All Rights Reserved

+
+ +
+ +
+ + + \ No newline at end of file diff --git a/upgrade-your-browser/end-of-ie-support/js/er3eport.js b/upgrade-your-browser/end-of-ie-support/js/er3eport.js new file mode 100644 index 0000000..62f74f1 --- /dev/null +++ b/upgrade-your-browser/end-of-ie-support/js/er3eport.js @@ -0,0 +1,60 @@ +// simple error report by baidu tongji + +var _hmt = _hmt || []; + +var er3eport = {}; +er3eport.start = (new Date().getTime()); +er3eport.codetime = function () { + return (new Date().getTime()) - er3eport.start; +}; +er3eport.dodnt = function () { + window.dnt = 1; if (typeof window.dodnt === 'function') window.dodnt(); +}; +er3eport.jqdefined = function () { + _hmt.push(['_setCustomVar', 2, 'JSERROR', 'jQueryDefined' + ' # ' + er3eport.codetime(), 3]); + er3eport.dodnt(); +}; +er3eport.listener = function (msg) { + + var logstr = false; + var errtype = 'JSERROR'; + if (typeof msg === 'string') { + logstr = msg; + + } else { + if (msg.error) logstr = msg.error.stack; + else if (msg.message) logstr = msg.message; + + var src; + if (msg.srcElement && msg.srcElement.src) src = msg.srcElement.src; + else if (msg.target && msg.target.src) src = msg.target.src; + + if (! logstr) { + if (src) { + logstr = 'FileError: ' + src; + errtype = 'FILEERROR'; + } else if (msg.type) { + logstr = msg.type; + } + } + } + + if (typeof logstr !== 'string') { + logstr = 'empty_error_string' + } else { + logstr = logstr.replace(/\n/g, '').replace(/\s+/g, ' '); + } + + _hmt.push(['_trackEvent', errtype, window.location.pathname, logstr + ' #UA# ' + navigator.userAgent + ' # ' + er3eport.codetime()]); + + return true; +} + +if (typeof jQuery === 'function') er3eport.jqdefined(); +if (Object.defineProperty) Object.defineProperty(window, 'jQuery', {set: er3eport.jqdefined}); + +if (window.addEventListener) { + window.addEventListener('error', er3eport.listener, true); +} else if (window.attachEvent) { + window.attachEvent('onerror', er3eport.listener); +} \ No newline at end of file diff --git a/upgrade-your-browser/end-of-ie-support/js/hello.world.js b/upgrade-your-browser/end-of-ie-support/js/hello.world.js new file mode 100644 index 0000000..cdb8a1b --- /dev/null +++ b/upgrade-your-browser/end-of-ie-support/js/hello.world.js @@ -0,0 +1,83 @@ +setTimeout(function() { + + var realPathname = window.location.pathname; + // ie 兼容 + if (realPathname.indexOf('/') !== 0) { + realPathname = '/' + realPathname; + } + var isUPPage = realPathname === '/upgrade-your-browser.html'; + var isSpHost = window.location.hostname === 'support.dmeng.net'; + window.dodnt = function() { + var now = new Date(); var time = now.getTime(); time += 600 * 1000; now.setTime(time); + document.cookie = 'dnt=1' + '; expires=' + now.toUTCString() + '; path=/'; + }; var doTrack = typeof window.dnt === 'undefined'; + if (doTrack === false && document.cookie.match(/dnt=1/) === null) window.dodnt(); + + window._hmt = window._hmt || []; + var _hmt_id = '6ddc2cf73e10ed480880c454b957e809'; + if (isSpHost) { + + if (doTrack) { + + _hmt_id = '3546503052812606f053b8bb63ef0e99'; + + // 统计需要升级的IE版本 + if (isUPPage) { + + var iever = "none"; + + var _jsver = 0; + /*@cc_on + _jsver = @_jscript_version; + @*/ + if (_jsver === 0) { + // IE11 或者不是 IE + + if (!!window.MSInputMethodContext && !!document.documentMode) { + iever = 11; + } + } else { + var docmode = document.documentMode; + if (!! docmode && docmode > 5) { + iever = docmode; + } else if (_jsver === 5.7 && window.XMLHttpRequest) { + iever = 7; + } else if (_jsver === 5.6 || (_jsver === 5.7 && !window.XMLHttpRequest)) { + iever = 6; + } else { + iever = 5; + } + iever += ""; + } + + var winver = 'other'; + var ua = navigator.userAgent; + + if (ua.indexOf("Windows NT 5") !== -1) { + winver = 'winXP'; + } else if (ua.indexOf("Windows NT 6.1") !== -1) { + winver = 'win7'; + } else if (ua.indexOf("Windows NT 6.2") !== -1) { + winver = 'win8'; + } else if (ua.indexOf("Windows NT 6.3") !== -1) { + winver = 'win8.1'; + } else if (ua.indexOf("Windows NT 10") !== -1) { + winver = 'win10'; + } + + _hmt.push(['_setCustomVar', 1, 'ClientVer', winver + "_IE" + iever, 3]); + } + + } else { + _hmt_id = 'b5afc37c04e670dc17f68727f92ea21c'; + } + } + + _hmt.unshift(['_setAccount', _hmt_id]); + + var helloWorldJS = document.getElementById('hello-world-js'); + var hm = document.createElement('script'); + hm.src = '//hm.baidu.com/hm.js?' + _hmt_id; + helloWorldJS.parentNode.insertBefore(hm, helloWorldJS); + +}, 1500); diff --git a/upgrade-your-browser/favicon.ico b/upgrade-your-browser/favicon.ico new file mode 100644 index 0000000..e00b973 Binary files /dev/null and b/upgrade-your-browser/favicon.ico differ diff --git a/upgrade-your-browser/images/chrome.png b/upgrade-your-browser/images/chrome.png new file mode 100644 index 0000000..5849183 Binary files /dev/null and b/upgrade-your-browser/images/chrome.png differ diff --git a/upgrade-your-browser/images/edge.png b/upgrade-your-browser/images/edge.png new file mode 100644 index 0000000..8e29cdc Binary files /dev/null and b/upgrade-your-browser/images/edge.png differ diff --git a/upgrade-your-browser/images/firefox.png b/upgrade-your-browser/images/firefox.png new file mode 100644 index 0000000..082729e Binary files /dev/null and b/upgrade-your-browser/images/firefox.png differ diff --git a/upgrade-your-browser/images/qqbrowser.png b/upgrade-your-browser/images/qqbrowser.png new file mode 100644 index 0000000..33640c4 Binary files /dev/null and b/upgrade-your-browser/images/qqbrowser.png differ diff --git a/upgrade-your-browser/images/safari.png b/upgrade-your-browser/images/safari.png new file mode 100644 index 0000000..809d0e8 Binary files /dev/null and b/upgrade-your-browser/images/safari.png differ diff --git a/upgrade-your-browser/images/se360.png b/upgrade-your-browser/images/se360.png new file mode 100644 index 0000000..4002907 Binary files /dev/null and b/upgrade-your-browser/images/se360.png differ diff --git a/upgrade-your-browser/index.html b/upgrade-your-browser/index.html new file mode 100644 index 0000000..4efb6de --- /dev/null +++ b/upgrade-your-browser/index.html @@ -0,0 +1,97 @@ + + + + + + + + + + 请升级您的浏览器 + + + + + + + + + + + +
+

是时候升级你的浏览器了

+

你正在使用旧版 Internet Explorer（ IE11 及以下版本或使用该内核的浏览器 ）。这意味着在升级浏览器前，你将无法访问此网站。

+
+

请注意：Windows XP 及旧版 Internet Explorer 的支持服务已终止

+

自2016年1月12日起，微软不再为 IE 11 以下版本提供相应支持和更新。没有关键的浏览器安全更新，您的电脑可能易受有害病毒、间谍软件和其他恶意软件的攻击，它们可以窃取或损害您的业务数据和信息。请参阅 微软对旧版 Internet Explorer 的支持服务已终止的说明 。

+
+

更先进的浏览器

+

推荐使用以下浏览器的最新版本。如果你的电脑已有以下浏览器的最新版本则直接使用该浏览器或开启极速模式访问即可。

+ + + +
+

为什么会出现这个页面？

+

如果你不知道升级浏览器是什么意思，请请教一些熟练电脑操作的朋友。如果你使用的不是 IE6 / 7 / 8 / 9 / 10，而是 Google Chrome、Safari、Microsoft Edge、火狐浏览器等，出现这个页面可能是因为你使用的不是该浏览器的最新版本，升级至最新即可。 +

+
+

一起抵制 IE6、IE7、IE8、IE9、IE10、IE11

+

为了兼容这个曾经的浏览器霸主，网页设计人员需要做大量的代码工作。对于普通用户而言，低版本 IE 更是一个岌岌可危的安全隐患，在 Windows 历史上几次大的木马病毒事件都是利用 IE 漏洞进行传播。所以，请和我们一起抵制 IE 的过期版本！ +

+
+

Copyright © 2020 無名 . All Rights Reserved

+
+
+ +
+ + + \ No newline at end of file diff --git a/upgrade-your-browser/js/er3eport.js b/upgrade-your-browser/js/er3eport.js new file mode 100644 index 0000000..62f74f1 --- /dev/null +++ b/upgrade-your-browser/js/er3eport.js @@ -0,0 +1,60 @@ +// simple error report by baidu tongji + +var _hmt = _hmt || []; + +var er3eport = {}; +er3eport.start = (new Date().getTime()); +er3eport.codetime = function () { + return (new Date().getTime()) - er3eport.start; +}; +er3eport.dodnt = function () { + window.dnt = 1; if (typeof window.dodnt === 'function') window.dodnt(); +}; +er3eport.jqdefined = function () { + _hmt.push(['_setCustomVar', 2, 'JSERROR', 'jQueryDefined' + ' # ' + er3eport.codetime(), 3]); + er3eport.dodnt(); +}; +er3eport.listener = function (msg) { + + var logstr = false; + var errtype = 'JSERROR'; + if (typeof msg === 'string') { + logstr = msg; + + } else { + if (msg.error) logstr = msg.error.stack; + else if (msg.message) logstr = msg.message; + + var src; + if (msg.srcElement && msg.srcElement.src) src = msg.srcElement.src; + else if (msg.target && msg.target.src) src = msg.target.src; + + if (! logstr) { + if (src) { + logstr = 'FileError: ' + src; + errtype = 'FILEERROR'; + } else if (msg.type) { + logstr = msg.type; + } + } + } + + if (typeof logstr !== 'string') { + logstr = 'empty_error_string' + } else { + logstr = logstr.replace(/\n/g, '').replace(/\s+/g, ' '); + } + + _hmt.push(['_trackEvent', errtype, window.location.pathname, logstr + ' #UA# ' + navigator.userAgent + ' # ' + er3eport.codetime()]); + + return true; +} + +if (typeof jQuery === 'function') er3eport.jqdefined(); +if (Object.defineProperty) Object.defineProperty(window, 'jQuery', {set: er3eport.jqdefined}); + +if (window.addEventListener) { + window.addEventListener('error', er3eport.listener, true); +} else if (window.attachEvent) { + window.attachEvent('onerror', er3eport.listener); +} \ No newline at end of file diff --git a/upgrade-your-browser/js/hello.world.js b/upgrade-your-browser/js/hello.world.js new file mode 100644 index 0000000..cdb8a1b --- /dev/null +++ b/upgrade-your-browser/js/hello.world.js @@ -0,0 +1,83 @@ +setTimeout(function() { + + var realPathname = window.location.pathname; + // ie 兼容 + if (realPathname.indexOf('/') !== 0) { + realPathname = '/' + realPathname; + } + var isUPPage = realPathname === '/upgrade-your-browser.html'; + var isSpHost = window.location.hostname === 'support.dmeng.net'; + window.dodnt = function() { + var now = new Date(); var time = now.getTime(); time += 600 * 1000; now.setTime(time); + document.cookie = 'dnt=1' + '; expires=' + now.toUTCString() + '; path=/'; + }; var doTrack = typeof window.dnt === 'undefined'; + if (doTrack === false && document.cookie.match(/dnt=1/) === null) window.dodnt(); + + window._hmt = window._hmt || []; + var _hmt_id = '6ddc2cf73e10ed480880c454b957e809'; + if (isSpHost) { + + if (doTrack) { + + _hmt_id = '3546503052812606f053b8bb63ef0e99'; + + // 统计需要升级的IE版本 + if (isUPPage) { + + var iever = "none"; + + var _jsver = 0; + /*@cc_on + _jsver = @_jscript_version; + @*/ + if (_jsver === 0) { + // IE11 或者不是 IE + + if (!!window.MSInputMethodContext && !!document.documentMode) { + iever = 11; + } + } else { + var docmode = document.documentMode; + if (!! docmode && docmode > 5) { + iever = docmode; + } else if (_jsver === 5.7 && window.XMLHttpRequest) { + iever = 7; + } else if (_jsver === 5.6 || (_jsver === 5.7 && !window.XMLHttpRequest)) { + iever = 6; + } else { + iever = 5; + } + iever += ""; + } + + var winver = 'other'; + var ua = navigator.userAgent; + + if (ua.indexOf("Windows NT 5") !== -1) { + winver = 'winXP'; + } else if (ua.indexOf("Windows NT 6.1") !== -1) { + winver = 'win7'; + } else if (ua.indexOf("Windows NT 6.2") !== -1) { + winver = 'win8'; + } else if (ua.indexOf("Windows NT 6.3") !== -1) { + winver = 'win8.1'; + } else if (ua.indexOf("Windows NT 10") !== -1) { + winver = 'win10'; + } + + _hmt.push(['_setCustomVar', 1, 'ClientVer', winver + "_IE" + iever, 3]); + } + + } else { + _hmt_id = 'b5afc37c04e670dc17f68727f92ea21c'; + } + } + + _hmt.unshift(['_setAccount', _hmt_id]); + + var helloWorldJS = document.getElementById('hello-world-js'); + var hm = document.createElement('script'); + hm.src = '//hm.baidu.com/hm.js?' + _hmt_id; + helloWorldJS.parentNode.insertBefore(hm, helloWorldJS); + +}, 1500);