first commit
1
.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
.vscode
|
21
LICENSE
Normal file
@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2022 imsyy
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
44
README.md
Normal file
@ -0,0 +1,44 @@
|
||||
<p>
|
||||
<strong><h2>Snavigation</h2></strong>
|
||||
一个简约的起始页
|
||||
</p>
|
||||
|
||||
![Snavigation](https://img.imsyy.top/other/Snavigation.png)
|
||||
|
||||
>尚未完成
|
||||
|
||||
### Demo
|
||||
>由于 CDN 缓存原因,查看最新效果可能需要 `Ctrl` + `F5` 强制刷新浏览器缓存
|
||||
|
||||
- [Snavigation](https://nav.imsyy.top)
|
||||
|
||||
### 功能
|
||||
|
||||
- [x] 载入动画
|
||||
- [x] 搜索引擎切换
|
||||
- [x] 时间及天气显示
|
||||
- [x] 快捷方式自定义
|
||||
- [x] 网站背景自定义
|
||||
- [x] 数据备份及恢复
|
||||
- [x] 移动端适配
|
||||
* [ ] 还没想好呢
|
||||
|
||||
### 插件
|
||||
|
||||
* [iziToast](https://izitoast.marcelodolza.com/)
|
||||
* [Iconfont](https://www.iconfont.cn/)
|
||||
* [jQuery](https://jquery.com/)
|
||||
|
||||
### API
|
||||
|
||||
* [小歪 API](https://api.ixiaowai.cn/)
|
||||
* [天气 API](https://www.tianqiapi.com/)
|
||||
|
||||
### 鸣谢
|
||||
|
||||
本站部分内容参考自
|
||||
|
||||
* [青柠起始页](https://limestart.cn/)
|
||||
* [sou2](https://github.com/yeetime/sou2/)
|
||||
|
||||
<a title="SSL" target="_blank" href="https://myssl.com/seal/detail?domain=blog.imsyy.top"><img src="https://img.shields.io/badge/MySSL-安全认证-brightgreen"></a> <a title="CDN" target="_blank" href="https://cdnjs.com/"><img src="https://img.shields.io/badge/CDN-Cloudflare-blue"></a> <a title="Copyright" target="_blank" href="https://imsyy.top/"><img src="https://img.shields.io/badge/Copyright%20%C2%A9%202020--2022-%E7%84%A1%E5%90%8D-red"></a>
|
202
css/animation.css
Normal file
@ -0,0 +1,202 @@
|
||||
/*渐入动画*/
|
||||
@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;
|
||||
}
|
||||
}
|
||||
|
||||
/*文字闪烁*/
|
||||
@-webkit-keyframes fadenum {
|
||||
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@-moz-keyframes fadenum {
|
||||
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@-o-keyframes fadenum {
|
||||
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@keyframes fadenum {
|
||||
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/*下沉动画*/
|
||||
@-moz-keyframes down {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 44%;
|
||||
/* -webkit-transform: translateY(-25%);
|
||||
-moz-transform: translateY(-25%);
|
||||
-o-transform: translateY(-25%);
|
||||
-ms-transform: translateY(-25%);
|
||||
transform: translateY(-25%) */
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
top: 46%;
|
||||
/* -webkit-transform: translateY(-20%);
|
||||
-moz-transform: translateY(-20%);
|
||||
-o-transform: translateY(-20%);
|
||||
-ms-transform: translateY(-20%);
|
||||
transform: translateY(-20%) */
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes down {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 44%;
|
||||
/* -webkit-transform: translateY(-25%);
|
||||
-moz-transform: translateY(-25%);
|
||||
-o-transform: translateY(-25%);
|
||||
-ms-transform: translateY(-25%);
|
||||
transform: translateY(-25%) */
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
top: 46%;
|
||||
/* -webkit-transform: translateY(-20%);
|
||||
-moz-transform: translateY(-20%);
|
||||
-o-transform: translateY(-20%);
|
||||
-ms-transform: translateY(-20%);
|
||||
transform: translateY(-20%) */
|
||||
}
|
||||
}
|
||||
|
||||
@-o-keyframes down {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 44%;
|
||||
/* -webkit-transform: translateY(-25%);
|
||||
-moz-transform: translateY(-25%);
|
||||
-o-transform: translateY(-25%);
|
||||
-ms-transform: translateY(-25%);
|
||||
transform: translateY(-25%) */
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
top: 46%;
|
||||
/* -webkit-transform: translateY(-20%);
|
||||
-moz-transform: translateY(-20%);
|
||||
-o-transform: translateY(-20%);
|
||||
-ms-transform: translateY(-20%);
|
||||
transform: translateY(-20%) */
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes down {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: 44%;
|
||||
/* -webkit-transform: translateY(-25%);
|
||||
-moz-transform: translateY(-25%);
|
||||
-o-transform: translateY(-25%);
|
||||
-ms-transform: translateY(-25%);
|
||||
transform: translateY(-25%) */
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
-ms-filter: none;
|
||||
filter: none;
|
||||
top: 46%;
|
||||
/* -webkit-transform: translateY(-20%);
|
||||
-moz-transform: translateY(-20%);
|
||||
-o-transform: translateY(-20%);
|
||||
-ms-transform: translateY(-20%);
|
||||
transform: translateY(-20%) */
|
||||
}
|
||||
}
|
0
css/firefox.css
Normal file
92
css/font.css
Normal file
@ -0,0 +1,92 @@
|
||||
@font-face {
|
||||
font-family: "MiSans";
|
||||
src: url('../font/MiSans-Regular.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "iconfont";
|
||||
/* Project id 3222465 */
|
||||
src: url('//at.alicdn.com/t/font_3222465_kuwc8yy7j9g.woff2?t=1647790391080') format('woff2'),
|
||||
url('//at.alicdn.com/t/font_3222465_kuwc8yy7j9g.woff?t=1647790391080') format('woff'),
|
||||
url('//at.alicdn.com/t/font_3222465_kuwc8yy7j9g.ttf?t=1647790391080') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-tianjia-:before {
|
||||
content: "\e643";
|
||||
}
|
||||
|
||||
.icon-taobao:before {
|
||||
content: "\e755";
|
||||
}
|
||||
|
||||
.icon-jingdong:before {
|
||||
content: "\e618";
|
||||
}
|
||||
|
||||
.icon-xinlangweibo:before {
|
||||
content: "\e601";
|
||||
}
|
||||
|
||||
.icon-zhihu:before {
|
||||
content: "\e60a";
|
||||
}
|
||||
|
||||
.icon-github:before {
|
||||
content: "\e691";
|
||||
}
|
||||
|
||||
.icon-delete:before {
|
||||
content: "\e94d";
|
||||
}
|
||||
|
||||
.icon-home:before {
|
||||
content: "\e964";
|
||||
}
|
||||
|
||||
.icon-xiugai:before {
|
||||
content: "\e626";
|
||||
}
|
||||
|
||||
.icon-bilibilidonghua:before {
|
||||
content: "\e8b1";
|
||||
}
|
||||
|
||||
.icon-wangluo:before {
|
||||
content: "\e600";
|
||||
}
|
||||
|
||||
.icon-sougousousuo:before {
|
||||
content: "\e685";
|
||||
}
|
||||
|
||||
.icon-360sousuo:before {
|
||||
content: "\e64d";
|
||||
}
|
||||
|
||||
.icon-baidu:before {
|
||||
content: "\eb49";
|
||||
}
|
||||
|
||||
.icon-bing:before {
|
||||
content: "\eb4c";
|
||||
}
|
||||
|
||||
.icon-google:before {
|
||||
content: "\ebaa";
|
||||
}
|
||||
|
||||
.icon-shezhi:before {
|
||||
content: "\e634";
|
||||
}
|
||||
|
||||
.icon-sousuo:before {
|
||||
content: "\e635";
|
||||
}
|
127
css/loading.css
Normal file
@ -0,0 +1,127 @@
|
||||
@charset "utf-8";
|
||||
|
||||
#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(10px);
|
||||
}
|
||||
|
||||
#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);
|
||||
}
|
||||
}
|
94
css/mobile.css
Normal file
@ -0,0 +1,94 @@
|
||||
@charset "utf-8";
|
||||
|
||||
/*小于1200px时*/
|
||||
@media (max-width: 1200px) {
|
||||
|
||||
/*书签及设置高度*/
|
||||
.mark,
|
||||
.set {
|
||||
margin-top: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
/*小于720px时*/
|
||||
@media (max-width: 720px) {
|
||||
|
||||
/*书签*/
|
||||
.quick,
|
||||
.quicks {
|
||||
width: 23%;
|
||||
min-width: 23%;
|
||||
max-width: 23%;
|
||||
}
|
||||
}
|
||||
|
||||
/*小于512px时*/
|
||||
@media (max-width: 512px) {
|
||||
|
||||
/*文字大小*/
|
||||
#time_text {
|
||||
font-size: 2.75rem;
|
||||
}
|
||||
|
||||
#day {
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.weather {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.wd::-webkit-input-placeholder {
|
||||
letter-spacing: 1px;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
/*搜索引擎*/
|
||||
.se-li {
|
||||
width: 31.33%;
|
||||
min-width: 31.33%;
|
||||
max-width: 31.33%;
|
||||
}
|
||||
|
||||
/*设置按钮*/
|
||||
#menu i {
|
||||
font-size: 1.45rem;
|
||||
}
|
||||
|
||||
/*书签*/
|
||||
.quick,
|
||||
.quicks {
|
||||
width: 31.33%;
|
||||
min-width: 31.33%;
|
||||
max-width: 31.33%;
|
||||
}
|
||||
|
||||
/*壁纸设置*/
|
||||
#wallpaper {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
#wallpaper_text {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.form-radio {
|
||||
margin: 0px 10px 30px 0px;
|
||||
}
|
||||
|
||||
/*隐藏*/
|
||||
.mobile {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* 大于568px时 */
|
||||
@media (min-width: 568px) {
|
||||
.iziToast {
|
||||
border-radius: 30px !important;
|
||||
}
|
||||
|
||||
.iziToast-wrapper {
|
||||
padding: 10px 0px !important;
|
||||
}
|
||||
}
|
1010
css/style.css
Normal file
BIN
favicon.ico
Normal file
After Width: | Height: | Size: 17 KiB |
BIN
font/MiSans-Regular.woff
Normal file
BIN
img/background1.webp
Normal file
After Width: | Height: | Size: 75 KiB |
BIN
img/background10.webp
Normal file
After Width: | Height: | Size: 63 KiB |
BIN
img/background2.webp
Normal file
After Width: | Height: | Size: 136 KiB |
BIN
img/background3.webp
Normal file
After Width: | Height: | Size: 65 KiB |
BIN
img/background4.webp
Normal file
After Width: | Height: | Size: 227 KiB |
BIN
img/background5.webp
Normal file
After Width: | Height: | Size: 215 KiB |
BIN
img/background6.webp
Normal file
After Width: | Height: | Size: 42 KiB |
BIN
img/background7.webp
Normal file
After Width: | Height: | Size: 58 KiB |
BIN
img/background8.webp
Normal file
After Width: | Height: | Size: 151 KiB |
BIN
img/background9.webp
Normal file
After Width: | Height: | Size: 106 KiB |
BIN
img/icon/favicon - 128.ico
Normal file
After Width: | Height: | Size: 66 KiB |
BIN
img/icon/favicon - 32.ico
Normal file
After Width: | Height: | Size: 4.2 KiB |
BIN
img/icon/favicon - 64.ico
Normal file
After Width: | Height: | Size: 17 KiB |
523
index.html
Normal file
@ -0,0 +1,523 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Snavigation</title>
|
||||
<link rel="icon" href="favicon.ico">
|
||||
<!-- jQuery -->
|
||||
<script src="https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.5.1/jquery.min.js"></script>
|
||||
<!-- 引入样式 -->
|
||||
<link rel="stylesheet" type="text/css" href="./css/style.css">
|
||||
<link rel="stylesheet" type="text/css" href="./css/font.css">
|
||||
<link rel="stylesheet" type="text/css" href="./css/loading.css">
|
||||
<link rel="stylesheet" type="text/css" href="./css/mobile.css">
|
||||
<link rel="stylesheet" type="text/css" href="./css/firefox.css">
|
||||
<link rel="stylesheet" type="text/css" href="./css/animation.css">
|
||||
<!-- Izitoast -->
|
||||
<link rel="stylesheet" href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/izitoast/1.4.0/css/iziToast.min.css">
|
||||
<script type="text/javascript"
|
||||
src="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/izitoast/1.4.0/js/iziToast.min.js">
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!--加载动画-->
|
||||
<div id="loading-box">
|
||||
<div class="loading-left-bg"></div>
|
||||
<div class="loading-right-bg"></div>
|
||||
<div class="spinner-box">
|
||||
<div class="loader">
|
||||
<div class="inner one"></div>
|
||||
<div class="inner two"></div>
|
||||
<div class="inner three"></div>
|
||||
</div>
|
||||
<div class="loading-word">
|
||||
<p class="loading-title">Snavigation</p>
|
||||
<span id="loading-text">加载中</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 背景图片 -->
|
||||
<div class="bg-all">
|
||||
<img id="bg" onerror="this.classList.add('error');"></img>
|
||||
<div class="cover"></div>
|
||||
</div>
|
||||
<!-- 主体内容 -->
|
||||
<section id="section" class="section">
|
||||
<!-- 搜索框 -->
|
||||
<div id="content">
|
||||
<div class="con">
|
||||
<!-- 时间天气 -->
|
||||
<div class="tool-all">
|
||||
<div class="time">
|
||||
<span id="time_text">00<span id="point">:</span>00</span>
|
||||
<span id="day">0 月 00 日 周一</span>
|
||||
</div>
|
||||
<div class="weather">
|
||||
<span id="wea_text">N/A</span> <span id="tem2">N/A</span>°C ~ <span
|
||||
id="tem1">N/A</span>°C
|
||||
</div>
|
||||
</div>
|
||||
<!-- 搜索框 -->
|
||||
<div class="sou">
|
||||
<form class="search" action="https://www.baidu.com/s" target="_Blank">
|
||||
<div class="all-search">
|
||||
<div class="se" title="点击切换搜索引擎">
|
||||
<i id="icon-se" class="iconfont icon-baidu"></i>
|
||||
</div>
|
||||
<input class="wd" type="text" name="wd" placeholder="想要搜点什么" onfocus="this.placeholder=''"
|
||||
onblur="this.placeholder='想要搜点什么'" autocomplete="off" required="required">
|
||||
<div class="sou-button">
|
||||
<button class="s" id="s-button">
|
||||
<i id="icon-sou" class="iconfont icon-sousuo"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div id="keywords" style="display: none;"></div>
|
||||
<div class="search-engine" style="display: none;">
|
||||
<div class="search-engine-list">
|
||||
<div class="se-li">
|
||||
<a class="se-li-text" data-url="https://www.baidu.com/s" data-name="wd"
|
||||
data-icon="iconfont icon-baidu">
|
||||
<i id="icon-sou-list" class="iconfont icon-sousuo"></i>
|
||||
<span>百度</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="se-li" data-url="https://cn.bing.com/search" data-name="q"
|
||||
data-icon="iconfont icon-bing">
|
||||
<a class="se-li-text">
|
||||
<i id="icon-sou-list" class="iconfont icon-bing"></i>
|
||||
<span>必应</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="se-li" data-url="https://www.google.com/search" data-name="q"
|
||||
data-icon="iconfont icon-google">
|
||||
<a class="se-li-text">
|
||||
<i id="icon-sou-list" class="iconfont icon-google"></i>
|
||||
<span>谷歌</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="se-li" data-url="https://www.sogou.com/web" data-name="query"
|
||||
data-icon="iconfont icon-bing">
|
||||
<a class="se-li-text">
|
||||
<i id="icon-sou-list" class="iconfont icon-sougousousuo"></i>
|
||||
<span>搜狗</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 书签页 -->
|
||||
<div class="mark" style="display: none;">
|
||||
<div class="tab">
|
||||
<div class="tab-item active">常用</div>
|
||||
<div class="tab-item">工具</div>
|
||||
<div class="tab-item">开发</div>
|
||||
<div class="tab-item">娱乐</div>
|
||||
<div class="tab-item">学习</div>
|
||||
<div class="tab-item">设计</div>
|
||||
</div>
|
||||
<div class="content products">
|
||||
<!-- 常用 -->
|
||||
<div class="mainCont selected">
|
||||
<div class="quick-all">
|
||||
<div class="quick" data-s="bilibili" title="哔哩哔哩 (゜-゜)つロ 干杯~">
|
||||
<a href="https://www.bilibili.com/" target="_blank">
|
||||
哔哩哔哩
|
||||
</a>
|
||||
</div>
|
||||
<div class="quick" data-s="github" title="GitHub">
|
||||
<a href="https://github.com/" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
<div class="quick" data-s="v2ex" title="V2EX">
|
||||
<a href="https://www.v2ex.com/" target="_blank">
|
||||
V2EX
|
||||
</a>
|
||||
</div>
|
||||
<div class="quick" data-s="steam" title="Steam">
|
||||
<a href="https://store.steampowered.com/" target="_blank">
|
||||
Steam
|
||||
</a>
|
||||
</div>
|
||||
<div class="quick" data-s="scp" title="控制,收容,保护">
|
||||
<a href="http://scp-wiki-cn.wikidot.com/" target="_blank">
|
||||
scp基金会2
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 工具 -->
|
||||
<div class="mainCont">
|
||||
<div class="quick-alls">
|
||||
<div class="quicks" data-s="bilibili" title="哔哩哔哩 (゜-゜)つロ 干杯~">
|
||||
<a href="https://www.bilibili.com/" target="_blank">
|
||||
哔哩哔哩
|
||||
</a>
|
||||
</div>
|
||||
<div class="quicks" data-s="github" title="GitHub">
|
||||
<a href="https://github.com/" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
<div class="quicks" data-s="v2ex" title="V2EX">
|
||||
<a href="https://www.v2ex.com/" target="_blank">
|
||||
V2EX
|
||||
</a>
|
||||
</div>
|
||||
<div class="quicks" data-s="steam" title="Steam">
|
||||
<a href="https://store.steampowered.com/" target="_blank">
|
||||
Steam
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 开发 -->
|
||||
<div class="mainCont">
|
||||
<div class="quick-alls">
|
||||
<div class="quicks" data-s="bilibili" title="哔哩哔哩 (゜-゜)つロ 干杯~">
|
||||
<a href="https://www.bilibili.com/" target="_blank">
|
||||
哔哩哔哩
|
||||
</a>
|
||||
</div>
|
||||
<div class="quicks" data-s="github" title="GitHub">
|
||||
<a href="https://github.com/" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 娱乐 -->
|
||||
<div class="mainCont">
|
||||
<div class="quick-alls">
|
||||
<div class="quicks" data-s="bilibili" title="哔哩哔哩 (゜-゜)つロ 干杯~">
|
||||
<a href="https://www.bilibili.com/" target="_blank">
|
||||
哔哩哔哩
|
||||
</a>
|
||||
</div>
|
||||
<div class="quicks" data-s="github" title="GitHub">
|
||||
<a href="https://github.com/" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 学习 -->
|
||||
<div class="mainCont">
|
||||
<div class="quick-alls">
|
||||
<div class="quicks" data-s="bilibili" title="哔哩哔哩 (゜-゜)つロ 干杯~">
|
||||
<a href="https://www.bilibili.com/" target="_blank">
|
||||
哔哩哔哩
|
||||
</a>
|
||||
</div>
|
||||
<div class="quicks" data-s="github" title="GitHub">
|
||||
<a href="https://github.com/" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 设计 -->
|
||||
<div class="mainCont">
|
||||
<div class="quick-alls">
|
||||
<div class="quicks" data-s="bilibili" title="哔哩哔哩 (゜-゜)つロ 干杯~">
|
||||
<a href="https://www.bilibili.com/" target="_blank">
|
||||
哔哩哔哩
|
||||
</a>
|
||||
</div>
|
||||
<div class="quicks" data-s="github" title="GitHub">
|
||||
<a href="https://github.com/" target="_blank">
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 设置图标 -->
|
||||
<div id="menu">
|
||||
<i id="icon-menu" class="iconfont icon-shezhi"></i>
|
||||
</div>
|
||||
<!-- 设置页 -->
|
||||
<div class="set" style="display: none;">
|
||||
<div class="tabs">
|
||||
<div class="tab-items actives">搜索引擎</div>
|
||||
<div class="tab-items" id="set-quick-menu">快捷方式</div>
|
||||
<div class="tab-items">背景图片</div>
|
||||
<div class="tab-items">数据备份</div>
|
||||
</div>
|
||||
<div class="contents productss">
|
||||
<!-- 搜索引擎设置 -->
|
||||
<div class="mainConts selected">
|
||||
<div class="set_blocks">
|
||||
<div class="set_blocks_content">
|
||||
<div class="se_list">
|
||||
<div class="se_list_table">
|
||||
<div class="se_list_div">
|
||||
<div class="se_list_num">
|
||||
<i class="iconfont icon-home"></i>
|
||||
</div>
|
||||
<div class="se_list_name">百度</div>
|
||||
<div class="se_list_button">
|
||||
<button class="set_se_default" value="baidu"
|
||||
style="border-radius: 8px 0px 0px 8px;">
|
||||
<span class="iconfont icon-home"></span>
|
||||
</button>
|
||||
<button class="edit_se" value="baidu">
|
||||
<span class="iconfont icon-xiugai"></span>
|
||||
</button>
|
||||
<button class="delete_se" value="baidu"
|
||||
style="border-radius: 0px 8px 8px 0px;">
|
||||
<span class="iconfont icon-delete"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="se_list_div">
|
||||
<div class="se_list_num">2</div>
|
||||
<div class="se_list_name">谷歌</div>
|
||||
<div class="se_list_button">
|
||||
<button class="set_se_default" value="google"><span
|
||||
class="iconfont icon-home"></span></button>
|
||||
<button class="edit_se" value="google"><span
|
||||
class="iconfont icon-xiugai"></span></button>
|
||||
<button class="delete_se" value="google"><span
|
||||
class="iconfont icon-delete"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="se_add_preinstall">
|
||||
<div class="set_se_list_add">
|
||||
<span class="set_quick_text">新增</span>
|
||||
</div>
|
||||
<div class="set_se_list_preinstall">
|
||||
<span class="set_quick_text">重置</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="add_content se_add_content" style="display:none;">
|
||||
<div class="froms">
|
||||
<div class="from_items">
|
||||
<div class="from_text">顺序</div>
|
||||
<input type="hidden" name="key_inhere">
|
||||
<input type="number" name="key" placeholder="请填入小于 20 的正整数"
|
||||
autocomplete="off"
|
||||
oninput="if(value>20)value=20;if(value<0)value=0">
|
||||
</div>
|
||||
<div class="from_items">
|
||||
<div class="from_text">名称</div>
|
||||
<input type="text" name="title" placeholder="搜索引擎名称" autocomplete="off">
|
||||
</div>
|
||||
<div class="from_items">
|
||||
<div class="from_text">网址</div>
|
||||
<input type="url" name="url" placeholder="以 https 或 http 开头的 URL"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<div class="from_items">
|
||||
<div class="from_text">字段名</div>
|
||||
<input type="text" name="name" placeholder="URL 中 ? 后面的字段"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<div class="from_items" style="display: none;">
|
||||
<input type="text" name="icon" placeholder="iconfont icon-Earth"
|
||||
value="iconfont icon-Earth" disabled="disabled">
|
||||
</div>
|
||||
</div>
|
||||
<div class="from_items button">
|
||||
<div class="se_add_save">保存</div>
|
||||
<div class="se_add_cancel">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 快捷方式设置 -->
|
||||
<div class="mainConts">
|
||||
<div class="set_blocks">
|
||||
<div class="set_blocks_content">
|
||||
<div class="quick_list">
|
||||
<div class="quick_list_table">
|
||||
<div class="quick_list_div">
|
||||
<div class="quick_list_div_num">1</div>
|
||||
<div class="quick_list_div_name">哔哩哔哩</div>
|
||||
<div class="quick_list_div_button">
|
||||
<div class="edit_quick" value="1">
|
||||
<span class="iconfont iconbook-edit"></span>
|
||||
</div>
|
||||
<div class="delete_quick" value="1">
|
||||
<span class="iconfont icondelete"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="quick_list_div">
|
||||
<div class="quick_list_div_num">2</div>
|
||||
<div class="quick_list_div_name">知乎</div>
|
||||
<div class="quick_list_div_button">
|
||||
<button class="edit_quick" value="2"
|
||||
style="border-radius: 8px 0px 0px 8px;">
|
||||
<span class="iconfont iconbook-edit"></span>
|
||||
</button>
|
||||
<button class="delete_quick" value="2"
|
||||
style="border-radius: 0px 8px 8px 0px;">
|
||||
<span class="iconfont icondelete"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="se_add_preinstalls">
|
||||
<div class="set_quick_list_add">
|
||||
<span class="set_quick_text">新增</span>
|
||||
</div>
|
||||
<div class="set_quick_list_preinstall">
|
||||
<span class="set_quick_text">重置</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="add_content quick_add_content" style="display:none;">
|
||||
<div class="froms">
|
||||
<div class="from_items">
|
||||
<div class="from_text">顺序</div>
|
||||
<input type="hidden" name="key_inhere">
|
||||
<input type="number" name="key" placeholder="请填入小于 100 的正整数"
|
||||
autocomplete="off"
|
||||
oninput="if(value>99)value=99;if(value<0)value=0">
|
||||
</div>
|
||||
<div class="from_items">
|
||||
<div class="from_text">名称</div>
|
||||
<input type="text" name="title" placeholder="网站名称" autocomplete="off">
|
||||
</div>
|
||||
<div class="from_items">
|
||||
<div class="from_text">网址</div>
|
||||
<input type="url" name="url" placeholder="以 https 或 http 开头的 URL"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<div class="from_items button">
|
||||
<div class="quick_add_save">保存</div>
|
||||
<div class="quick_add_cancel">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 背景图片设置 -->
|
||||
<div class="mainConts">
|
||||
<div class="set_blocks">
|
||||
<div class="set_tip">
|
||||
<span class="set_text mobile">点击下方选项以切换壁纸,使用除默认壁纸以外的选项可能会导致页面载入缓慢</span>
|
||||
<span class="set_text mobile">不建议使用以主色调为白色的壁纸,会导致本站部分元素无法辨认</span>
|
||||
<span class="set_text" id="wallpaper_text">请点击选项以查看各项说明,高亮项为选中,选中后刷新页面以生效</span>
|
||||
</div>
|
||||
<div class="set_blocks_content">
|
||||
<div class="from_container">
|
||||
<div class="froms">
|
||||
<div class="from_row">
|
||||
<div class="from_row_content">
|
||||
<div id="wallpaper">
|
||||
<div class="form-radio">
|
||||
<input type="radio" id="radio1" class="set-wallpaper"
|
||||
name="wallpaper-type" value="1" style="display: none;">
|
||||
<label class="form-radio-label" for="radio1">
|
||||
默认壁纸
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-radio">
|
||||
<input type="radio" id="radio2" class="set-wallpaper"
|
||||
name="wallpaper-type" value="2" style="display: none;">
|
||||
<label class="form-radio-label" for="radio2">
|
||||
必应每日
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-radio">
|
||||
<input type="radio" id="radio3" class="set-wallpaper"
|
||||
name="wallpaper-type" value="3" style="display: none;">
|
||||
<label class="form-radio-label" for="radio3">
|
||||
随机风景
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-radio">
|
||||
<input type="radio" id="radio4" class="set-wallpaper"
|
||||
name="wallpaper-type" value="4" style="display: none;">
|
||||
<label class="form-radio-label" for="radio4">
|
||||
随机二次元
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-radio mobile">
|
||||
<input type="radio" id="radio5"
|
||||
class="set-wallpaper wallpaper-custom"
|
||||
name="wallpaper-type" value="5" style="display: none;">
|
||||
<label class="form-radio-label" for="radio5">
|
||||
自定义壁纸
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="wallpaper_url" style="display: none;">
|
||||
<div class="from_row">
|
||||
<div class="from_items">
|
||||
<input type="text" name="wallpaper-url" id="wallpaper-url"
|
||||
placeholder="以 https 或 http 开头的 URL" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="from_items button" id="wallpaper-button" style="display: none;">
|
||||
<div class="wallpaper_save">保存</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 数据备份设置 -->
|
||||
<div class="mainConts">
|
||||
<div class="set_blocks">
|
||||
<div class="set_tip">
|
||||
<span class="set_text">点击导出会将本站文件导出至下载目录</span>
|
||||
<span class="set_text">点击导入可选择已备份文件进行恢复</span>
|
||||
<span class="set_text">本功能尚未完善,若遇到问题可在设置进行重置</span>
|
||||
</div>
|
||||
<div class="set_button">
|
||||
<div class="but-ordinary" id="my_data_in">导入</div>
|
||||
<div class="but-ordinary" id="my_data_out">导出</div>
|
||||
<input type="file" id="my_data_file" name="file" style="display: none">
|
||||
</div>
|
||||
<div class="set_version">
|
||||
<span class="set_version-text">MADE BY IMSYY</span>
|
||||
<span class="set_version-text2">© Snavigation v 1.2</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 主体内容结束 -->
|
||||
<!-- 版权信息 -->
|
||||
<div class="foot">
|
||||
<div class="power">Copyright © 2020
|
||||
<script>
|
||||
document.write(' - ' + (new Date()).getFullYear())
|
||||
</script> <a href="https://imsyy.top">無名</a> &
|
||||
<!-- 以下信息请不要修改哦 -->
|
||||
Made by <a href="https://github.com/imsyy/home" target="_blank">imsyy</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- noscript -->
|
||||
<noscript>
|
||||
<div class="noscript fixed-top">请开启 JavaScript</div>
|
||||
</noscript>
|
||||
<!-- JS -->
|
||||
<script type="text/javascript" src="./js/main.js"></script>
|
||||
<script type="text/javascript" src="./js/set.js"></script>
|
||||
<script type="text/javascript" src="./js/time.js"></script>
|
||||
<script type="text/javascript" src="./js/js.cookie.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
164
js/js.cookie.js
Normal file
@ -0,0 +1,164 @@
|
||||
/*!
|
||||
* JavaScript Cookie v2.2.1
|
||||
* https://github.com/js-cookie/js-cookie
|
||||
*
|
||||
* Copyright 2006, 2015 Klaus Hartl & Fagner Brack
|
||||
* Released under the MIT license
|
||||
*/
|
||||
;
|
||||
(function (factory) {
|
||||
var registeredInModuleLoader;
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define(factory);
|
||||
registeredInModuleLoader = true;
|
||||
}
|
||||
if (typeof exports === 'object') {
|
||||
module.exports = factory();
|
||||
registeredInModuleLoader = true;
|
||||
}
|
||||
if (!registeredInModuleLoader) {
|
||||
var OldCookies = window.Cookies;
|
||||
var api = window.Cookies = factory();
|
||||
api.noConflict = function () {
|
||||
window.Cookies = OldCookies;
|
||||
return api;
|
||||
};
|
||||
}
|
||||
}(function () {
|
||||
function extend() {
|
||||
var i = 0;
|
||||
var result = {};
|
||||
for (; i < arguments.length; i++) {
|
||||
var attributes = arguments[i];
|
||||
for (var key in attributes) {
|
||||
result[key] = attributes[key];
|
||||
}
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function decode(s) {
|
||||
return s.replace(/(%[0-9A-Z]{2})+/g, decodeURIComponent);
|
||||
}
|
||||
|
||||
function init(converter) {
|
||||
function api() {}
|
||||
|
||||
function set(key, value, attributes) {
|
||||
if (typeof document === 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
attributes = extend({
|
||||
path: '/'
|
||||
}, api.defaults, attributes);
|
||||
|
||||
if (typeof attributes.expires === 'number') {
|
||||
attributes.expires = new Date(new Date() * 1 + attributes.expires * 864e+5);
|
||||
}
|
||||
|
||||
// We're using "expires" because "max-age" is not supported by IE
|
||||
attributes.expires = attributes.expires ? attributes.expires.toUTCString() : '';
|
||||
|
||||
try {
|
||||
var result = JSON.stringify(value);
|
||||
if (/^[\{\[]/.test(result)) {
|
||||
value = result;
|
||||
}
|
||||
} catch (e) {}
|
||||
|
||||
value = converter.write ?
|
||||
converter.write(value, key) :
|
||||
encodeURIComponent(String(value))
|
||||
.replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g, decodeURIComponent);
|
||||
|
||||
key = encodeURIComponent(String(key))
|
||||
.replace(/%(23|24|26|2B|5E|60|7C)/g, decodeURIComponent)
|
||||
.replace(/[\(\)]/g, escape);
|
||||
|
||||
var stringifiedAttributes = '';
|
||||
for (var attributeName in attributes) {
|
||||
if (!attributes[attributeName]) {
|
||||
continue;
|
||||
}
|
||||
stringifiedAttributes += '; ' + attributeName;
|
||||
if (attributes[attributeName] === true) {
|
||||
continue;
|
||||
}
|
||||
|
||||
// Considers RFC 6265 section 5.2:
|
||||
// ...
|
||||
// 3. If the remaining unparsed-attributes contains a %x3B (";")
|
||||
// character:
|
||||
// Consume the characters of the unparsed-attributes up to,
|
||||
// not including, the first %x3B (";") character.
|
||||
// ...
|
||||
stringifiedAttributes += '=' + attributes[attributeName].split(';')[0];
|
||||
}
|
||||
|
||||
return (document.cookie = key + '=' + value + stringifiedAttributes);
|
||||
}
|
||||
|
||||
function get(key, json) {
|
||||
if (typeof document === 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
var jar = {};
|
||||
// To prevent the for loop in the first place assign an empty array
|
||||
// in case there are no cookies at all.
|
||||
var cookies = document.cookie ? document.cookie.split('; ') : [];
|
||||
var i = 0;
|
||||
|
||||
for (; i < cookies.length; i++) {
|
||||
var parts = cookies[i].split('=');
|
||||
var cookie = parts.slice(1).join('=');
|
||||
|
||||
if (!json && cookie.charAt(0) === '"') {
|
||||
cookie = cookie.slice(1, -1);
|
||||
}
|
||||
|
||||
try {
|
||||
var name = decode(parts[0]);
|
||||
cookie = (converter.read || converter)(cookie, name) ||
|
||||
decode(cookie);
|
||||
|
||||
if (json) {
|
||||
try {
|
||||
cookie = JSON.parse(cookie);
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
jar[name] = cookie;
|
||||
|
||||
if (key === name) {
|
||||
break;
|
||||
}
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
return key ? jar[key] : jar;
|
||||
}
|
||||
|
||||
api.set = set;
|
||||
api.get = function (key) {
|
||||
return get(key, false /* read as raw */ );
|
||||
};
|
||||
api.getJSON = function (key) {
|
||||
return get(key, true /* read as json */ );
|
||||
};
|
||||
api.remove = function (key, attributes) {
|
||||
set(key, '', extend(attributes, {
|
||||
expires: -1
|
||||
}));
|
||||
};
|
||||
|
||||
api.defaults = {};
|
||||
|
||||
api.withConverter = init;
|
||||
|
||||
return api;
|
||||
}
|
||||
|
||||
return init(function () {});
|
||||
}));
|
124
js/main.js
Normal file
@ -0,0 +1,124 @@
|
||||
//加载完成后执行
|
||||
window.addEventListener('load', function () {
|
||||
//载入动画
|
||||
$('#loading-box').attr('class', 'loaded');
|
||||
$('#bg').css("cssText", "transform: scale(1);filter: blur(0px);transition: ease 1.5s;");
|
||||
$('#section').css("cssText", "opacity: 1;transition: ease 1.5s;");
|
||||
$('.cover').css("cssText", "opacity: 1;transition: ease 1.5s;");
|
||||
|
||||
//用户欢迎
|
||||
iziToast.settings({
|
||||
timeout: 3000,
|
||||
backgroundColor: '#ffffff40',
|
||||
titleColor: '#efefef',
|
||||
messageColor: '#efefef',
|
||||
progressBar: false,
|
||||
close: false,
|
||||
closeOnEscape: true,
|
||||
position: 'topCenter',
|
||||
transitionIn: 'bounceInDown',
|
||||
transitionOut: 'flipOutX',
|
||||
displayMode: 'replace',
|
||||
layout: '1'
|
||||
});
|
||||
setTimeout(function () {
|
||||
iziToast.show({
|
||||
title: hello,
|
||||
message: '欢迎来到 Snavigation'
|
||||
});
|
||||
}, 800);
|
||||
|
||||
}, false)
|
||||
|
||||
//屏蔽浏览器默认右键
|
||||
// document.oncontextmenu = function () {
|
||||
// undefined
|
||||
// return false;
|
||||
// }
|
||||
|
||||
//获取时间
|
||||
var t = null;
|
||||
t = setTimeout(time, 1000);
|
||||
|
||||
function time() {
|
||||
clearTimeout(t);
|
||||
dt = new Date();
|
||||
var mm = dt.getMonth() + 1;
|
||||
var d = dt.getDate();
|
||||
var weekday = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
|
||||
var day = dt.getDay();
|
||||
var h = dt.getHours();
|
||||
var m = dt.getMinutes();
|
||||
if (h < 10) {
|
||||
h = "0" + h;
|
||||
}
|
||||
if (m < 10) {
|
||||
m = "0" + m;
|
||||
}
|
||||
$("#time_text").html(h + '<span id="point">:</span>' + m);
|
||||
$("#day").html(mm + " 月 " + d + " 日 " + weekday[day]);
|
||||
t = setTimeout(time, 1000);
|
||||
}
|
||||
|
||||
//获取天气
|
||||
//每日限量 100 次
|
||||
//请前往 https://www.tianqiapi.com/index/doc?version=v6 申请(免费)
|
||||
fetch('https://yiketianqi.com/api?unescape=1&version=v6&appid=43986679&appsecret=TksqGZT7')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
//$('#wea_text').html(data.wea + ' ' + data.tem_night + '℃' + ' ~ ' + data.tem_day + '℃')
|
||||
$('#wea_text').text(data.wea)
|
||||
$('#tem1').text(data.tem1)
|
||||
$('#tem2').text(data.tem2)
|
||||
})
|
||||
.catch(console.error)
|
||||
|
||||
//火狐浏览器独立样式
|
||||
if (isFirefox = navigator.userAgent.indexOf("Firefox") > 0) {
|
||||
var head = document.getElementsByTagName('head')[0];
|
||||
var link = document.createElement('link');
|
||||
link.href = './css/firefox.css';
|
||||
link.rel = 'stylesheet';
|
||||
link.type = 'text/css';
|
||||
head.appendChild(link);
|
||||
window.addEventListener('load', function () {
|
||||
setTimeout(function () {
|
||||
iziToast.show({
|
||||
timeout: 8000,
|
||||
message: '您正在使用火狐浏览器,部分功能可能不支持'
|
||||
});
|
||||
}, 3800);
|
||||
}, false)
|
||||
}
|
||||
|
||||
//Tab书签页
|
||||
$(function () {
|
||||
$(".mark .tab .tab-item").click(function () {
|
||||
$(this).addClass("active").siblings().removeClass("active");
|
||||
$(".products .mainCont").eq($(this).index()).css("display", "flex").siblings().css("display", "none");
|
||||
})
|
||||
})
|
||||
|
||||
//设置
|
||||
$(function () {
|
||||
$(".set .tabs .tab-items").click(function () {
|
||||
$(this).addClass("actives").siblings().removeClass("actives");
|
||||
$(".productss .mainConts").eq($(this).index()).css("display", "flex").siblings().css("display", "none");
|
||||
})
|
||||
})
|
||||
|
||||
//监听网页宽度
|
||||
// window.addEventListener('load', function () {
|
||||
// if (window.innerWidth <= 512) {
|
||||
// $('.wd').attr('placeholder', '搜索');
|
||||
// } else {
|
||||
// $('.wd').attr('placeholder', '想要搜点什么');
|
||||
// }
|
||||
// window.addEventListener('resize', function () {
|
||||
// if (window.innerWidth <= 512) {
|
||||
// $('.wd').attr('placeholder', '搜索');
|
||||
// } else {
|
||||
// $('.wd').attr('placeholder', '想要搜点什么');
|
||||
// }
|
||||
// })
|
||||
// })
|
18
js/time.js
Normal file
@ -0,0 +1,18 @@
|
||||
now = new Date(), hour = now.getHours()
|
||||
if (hour < 6) {
|
||||
var hello = "凌晨好";
|
||||
} else if (hour < 9) {
|
||||
var hello = "早上好";
|
||||
} else if (hour < 12) {
|
||||
var hello = "上午好";
|
||||
} else if (hour < 14) {
|
||||
var hello = "中午好";
|
||||
} else if (hour < 17) {
|
||||
var hello = "下午好";
|
||||
} else if (hour < 19) {
|
||||
var hello = "傍晚好";
|
||||
} else if (hour < 22) {
|
||||
var hello = "晚上好";
|
||||
} else {
|
||||
var hello = "夜深了";
|
||||
}
|
12
vercel.json
Normal file
@ -0,0 +1,12 @@
|
||||
{
|
||||
"version": 2,
|
||||
"routes": [{
|
||||
"handle": "filesystem"
|
||||
},
|
||||
{
|
||||
"src": "/(.*)",
|
||||
"status": 404,
|
||||
"dest": "/"
|
||||
}
|
||||
]
|
||||
}
|