From 24ef0d2a0c9483879c195a76e77a477db3f6ca72 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=98=94=E8=90=BD?= <45323514+BigCoke233@users.noreply.github.com> Date: Sat, 30 Mar 2019 15:31:58 +0800 Subject: Add files via upload --- assets/css/mark.min.css | 87 ++++-- assets/css/owo.min.css | 652 ++++++++++++++++++++++++++++++++++++++++++++- assets/js/id-transition.js | 18 ++ 3 files changed, 741 insertions(+), 16 deletions(-) create mode 100644 assets/js/id-transition.js (limited to 'assets') diff --git a/assets/css/mark.min.css b/assets/css/mark.min.css index ef99aec..59f73f1 100644 --- a/assets/css/mark.min.css +++ b/assets/css/mark.min.css @@ -31,6 +31,7 @@ a:hover,a:active{ /* 文章及文章列表 */ .post-item{ transition:all 0.5s; + overflow:hidden; } .post-item:hover{ box-shadow:0 2px 12px #ccc; @@ -55,20 +56,21 @@ a:hover,a:active{ .post-link:hover{ color:black; } +.post-banner-sm{ + margin-top:-15px; + margin-bottom:-15px; +} .post-banner{ - margin:-15px; margin-bottom:10px; + margin:-15px; + padding:0; } .media-banner{ height:20em; } -.pagenav,.page-navigator{ +.page-navigator{ margin-left:-40px; } -.page-navigator .next{ - float:right; - margin-right:-1px; -} .pagenav li,.page-navigator li{ display:inline-block; list-style-type:none; @@ -93,11 +95,7 @@ a:hover,a:active{ } .post-header{ - padding:15px; - background:rgba(5,5,5,0.5); - color:white; border:none; - margin-top:-112px; } .post-bread{ font-weight:bold; @@ -112,21 +110,19 @@ a:hover,a:active{ } .post-content img{ max-width:100%; - border-radius:4px; + border-radius:2px; box-shadow:0 0 5px #808080; -webkit-box-shadow:0 0 5px #808080; display:block; margin:12px auto; - transition:all 0.5s; + transition:box-shadow 0.5s; } .post-content img:hover{ - transform: translateY(-6px); box-shadow:0 0 15px #808080; -webkit-box-shadow:0 0 15px #808080; } .post-content p{ line-height:1.5em; - margin:15px; } .post-content h2{ border-left:3px solid #6495ED; @@ -164,9 +160,35 @@ a:hover,a:active{ } .saying-content{ margin-top:5px; + margin-left:10px; + margin-right:10px; +} +.saying-content h3{ + margin-left:-10px; + font-weight:bold; + margin-top:0; +} +.saying-info{ + margin-top:-10px; +} +.post-img-alt{ + font-size:14px; + color:gray; + text-align:center; + display:block; + margin-top:-10px; +} +.read-more{ + margin-top:-36px; } -.post-header a{ +/* Nb首页大图 */ +.jumbotron{ + height:50vh; + box-shadow:0 0 10px #808080; color:white; + text-align:Center; + padding-top:20vh; + text-shadow:0 0 10px #bababa; } /* 评论 */ .comment-normal-img{ @@ -237,6 +259,7 @@ a:hover,a:active{ font-size:10px; } + /* owo */ .OwO-logo{ display:inline-block; @@ -558,6 +581,40 @@ a:hover,a:active{ left:0; transition:all 0.5s; } +/* 文章内短代码 */ +.tip{ + display:block; + padding:10px; + background-color:rgb(250,250,250); + border-left:5px solid #ddd; + border-radius:2px; + color:#A9A9A9; +} +.tip.lblue{ + border-color:#4D90FE!important; + background-color:#F8F8FF!important; +} +.tip.yellow{ + border-color:#FFD700!important; + background-color:#FFF8DC!important; +} +.tip.red{ + border-color:#FF6347!important; + background-color:#FFE4E1!important; +} +.tip.green{ + border-color:#3CB371!important; + background-color:rgb(243,247,230)!important; +} +.post-stext{ + max-height:150px; + overflow:auto; + padding:5px; + padding-left:10px; + border:1px solid #ddd; + border-radius:4px; + box-shadow:0 0 1px #bababa inset; +} /* 滚动条 */ ::-webkit-scrollbar{ diff --git a/assets/css/owo.min.css b/assets/css/owo.min.css index c39e8e0..7fea525 100644 --- a/assets/css/owo.min.css +++ b/assets/css/owo.min.css @@ -1 +1,651 @@ -.OwO{position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.OwO:hover .OwO-logo{color:#444}.OwO.OwO-open .OwO-logo{border-radius:4px 4px 0 0;border-bottom:none;color:#444}.OwO.OwO-open .OwO-body{display:block}.OwO.OwO-up .OwO-body{top:inherit;bottom:21px;border-radius:4px 4px 4px 0}.OwO.OwO-up .OwO-body .OwO-bar .OwO-packages li:nth-child(1){border-radius:0}.OwO.OwO-up.OwO-open .OwO-logo{border:1px solid #ddd;border-radius:0 0 4px 4px;border-top:none}.OwO .OwO-logo{position:relative;display:inline-block;color:#888;background:#fff;border:1px solid #ddd;border-radius:4px;font-size:13px;padding:2px 5px;cursor:pointer;height:22px;box-sizing:border-box;z-index:2;line-height:16px}.OwO .OwO-logo:hover span{display:inline-block;-webkit-animation:a 5s infinite ease-in-out;animation:a 5s infinite ease-in-out}.OwO .OwO-body{display:none;position:absolute;width:400px;background:#fff;border:1px solid #ddd;z-index:1;top:21px;border-radius:0 4px 4px 4px}.OwO .OwO-body .OwO-items{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:none;padding:10px;margin:0;overflow:scroll;font-size:0}.OwO .OwO-body .OwO-items .OwO-item{list-style-type:none;background:#f7f7f7;padding:5px 10px;border-radius:5px;display:inline-block;font-size:12px;line-height:14px;margin:0 10px 12px 0;cursor:pointer;-webkit-transition:.3s;transition:.3s}.OwO .OwO-body .OwO-items .OwO-item:hover{background:#eee;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);-webkit-animation:a 5s infinite ease-in-out;animation:a 5s infinite ease-in-out}.OwO .OwO-body .OwO-items-emoji .OwO-item{font-size:20px;line-height:19px}.OwO .OwO-body .OwO-items-image .OwO-item{max-width:calc(25% - 10px);box-sizing:border-box}.OwO .OwO-body .OwO-items-image .OwO-item img{max-width:100%}.OwO .OwO-body .OwO-items-show{display:block}.OwO .OwO-body .OwO-bar{width:100%;height:30px;border-top:1px solid #ddd;background:#fff;border-radius:0 0 4px 4px;color:#444}.OwO .OwO-body .OwO-bar .OwO-packages{margin:0;padding:0;font-size:0}.OwO .OwO-body .OwO-bar .OwO-packages li{list-style-type:none;display:inline-block;line-height:30px;font-size:14px;padding:0 10px;cursor:pointer;margin-right:3px}.OwO .OwO-body .OwO-bar .OwO-packages li:nth-child(1){border-radius:0 0 0 3px}.OwO .OwO-body .OwO-bar .OwO-packages li:hover{background:#eee}.OwO .OwO-body .OwO-bar .OwO-packages .OwO-package-active{background:#eee;-webkit-transition:.3s;transition:.3s}@-webkit-keyframes a{2%{-webkit-transform:translateY(1.5px) rotate(1.5deg);transform:translateY(1.5px) rotate(1.5deg)}4%{-webkit-transform:translateY(-1.5px) rotate(-.5deg);transform:translateY(-1.5px) rotate(-.5deg)}6%{-webkit-transform:translateY(1.5px) rotate(-1.5deg);transform:translateY(1.5px) rotate(-1.5deg)}8%{-webkit-transform:translateY(-1.5px) rotate(-1.5deg);transform:translateY(-1.5px) rotate(-1.5deg)}10%{-webkit-transform:translateY(2.5px) rotate(1.5deg);transform:translateY(2.5px) rotate(1.5deg)}12%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}14%{-webkit-transform:translateY(-1.5px) rotate(1.5deg);transform:translateY(-1.5px) rotate(1.5deg)}16%{-webkit-transform:translateY(-.5px) rotate(-1.5deg);transform:translateY(-.5px) rotate(-1.5deg)}18%{-webkit-transform:translateY(.5px) rotate(-1.5deg);transform:translateY(.5px) rotate(-1.5deg)}20%{-webkit-transform:translateY(-1.5px) rotate(2.5deg);transform:translateY(-1.5px) rotate(2.5deg)}22%{-webkit-transform:translateY(.5px) rotate(-1.5deg);transform:translateY(.5px) rotate(-1.5deg)}24%{-webkit-transform:translateY(1.5px) rotate(1.5deg);transform:translateY(1.5px) rotate(1.5deg)}26%{-webkit-transform:translateY(.5px) rotate(.5deg);transform:translateY(.5px) rotate(.5deg)}28%{-webkit-transform:translateY(.5px) rotate(1.5deg);transform:translateY(.5px) rotate(1.5deg)}30%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}32%,34%{-webkit-transform:translateY(1.5px) rotate(-.5deg);transform:translateY(1.5px) rotate(-.5deg)}36%{-webkit-transform:translateY(-1.5px) rotate(2.5deg);transform:translateY(-1.5px) rotate(2.5deg)}38%{-webkit-transform:translateY(1.5px) rotate(-1.5deg);transform:translateY(1.5px) rotate(-1.5deg)}40%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}42%{-webkit-transform:translateY(2.5px) rotate(-1.5deg);transform:translateY(2.5px) rotate(-1.5deg)}44%{-webkit-transform:translateY(1.5px) rotate(.5deg);transform:translateY(1.5px) rotate(.5deg)}46%{-webkit-transform:translateY(-1.5px) rotate(2.5deg);transform:translateY(-1.5px) rotate(2.5deg)}48%{-webkit-transform:translateY(-.5px) rotate(.5deg);transform:translateY(-.5px) rotate(.5deg)}50%{-webkit-transform:translateY(.5px) rotate(.5deg);transform:translateY(.5px) rotate(.5deg)}52%{-webkit-transform:translateY(2.5px) rotate(2.5deg);transform:translateY(2.5px) rotate(2.5deg)}54%{-webkit-transform:translateY(-1.5px) rotate(1.5deg);transform:translateY(-1.5px) rotate(1.5deg)}56%{-webkit-transform:translateY(2.5px) rotate(2.5deg);transform:translateY(2.5px) rotate(2.5deg)}58%{-webkit-transform:translateY(.5px) rotate(2.5deg);transform:translateY(.5px) rotate(2.5deg)}60%{-webkit-transform:translateY(2.5px) rotate(2.5deg);transform:translateY(2.5px) rotate(2.5deg)}62%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}64%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}66%{-webkit-transform:translateY(1.5px) rotate(-.5deg);transform:translateY(1.5px) rotate(-.5deg)}68%{-webkit-transform:translateY(-1.5px) rotate(-.5deg);transform:translateY(-1.5px) rotate(-.5deg)}70%{-webkit-transform:translateY(1.5px) rotate(.5deg);transform:translateY(1.5px) rotate(.5deg)}72%{-webkit-transform:translateY(2.5px) rotate(1.5deg);transform:translateY(2.5px) rotate(1.5deg)}74%{-webkit-transform:translateY(-.5px) rotate(.5deg);transform:translateY(-.5px) rotate(.5deg)}76%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}78%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}80%{-webkit-transform:translateY(1.5px) rotate(1.5deg);transform:translateY(1.5px) rotate(1.5deg)}82%{-webkit-transform:translateY(-.5px) rotate(.5deg);transform:translateY(-.5px) rotate(.5deg)}84%{-webkit-transform:translateY(1.5px) rotate(2.5deg);transform:translateY(1.5px) rotate(2.5deg)}86%{-webkit-transform:translateY(-1.5px) rotate(-1.5deg);transform:translateY(-1.5px) rotate(-1.5deg)}88%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}90%{-webkit-transform:translateY(2.5px) rotate(-.5deg);transform:translateY(2.5px) rotate(-.5deg)}92%{-webkit-transform:translateY(.5px) rotate(-.5deg);transform:translateY(.5px) rotate(-.5deg)}94%{-webkit-transform:translateY(2.5px) rotate(.5deg);transform:translateY(2.5px) rotate(.5deg)}96%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}98%{-webkit-transform:translateY(-1.5px) rotate(-.5deg);transform:translateY(-1.5px) rotate(-.5deg)}0%,to{-webkit-transform:translate(0) rotate(0deg);transform:translate(0) rotate(0deg)}}@keyframes a{2%{-webkit-transform:translateY(1.5px) rotate(1.5deg);transform:translateY(1.5px) rotate(1.5deg)}4%{-webkit-transform:translateY(-1.5px) rotate(-.5deg);transform:translateY(-1.5px) rotate(-.5deg)}6%{-webkit-transform:translateY(1.5px) rotate(-1.5deg);transform:translateY(1.5px) rotate(-1.5deg)}8%{-webkit-transform:translateY(-1.5px) rotate(-1.5deg);transform:translateY(-1.5px) rotate(-1.5deg)}10%{-webkit-transform:translateY(2.5px) rotate(1.5deg);transform:translateY(2.5px) rotate(1.5deg)}12%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}14%{-webkit-transform:translateY(-1.5px) rotate(1.5deg);transform:translateY(-1.5px) rotate(1.5deg)}16%{-webkit-transform:translateY(-.5px) rotate(-1.5deg);transform:translateY(-.5px) rotate(-1.5deg)}18%{-webkit-transform:translateY(.5px) rotate(-1.5deg);transform:translateY(.5px) rotate(-1.5deg)}20%{-webkit-transform:translateY(-1.5px) rotate(2.5deg);transform:translateY(-1.5px) rotate(2.5deg)}22%{-webkit-transform:translateY(.5px) rotate(-1.5deg);transform:translateY(.5px) rotate(-1.5deg)}24%{-webkit-transform:translateY(1.5px) rotate(1.5deg);transform:translateY(1.5px) rotate(1.5deg)}26%{-webkit-transform:translateY(.5px) rotate(.5deg);transform:translateY(.5px) rotate(.5deg)}28%{-webkit-transform:translateY(.5px) rotate(1.5deg);transform:translateY(.5px) rotate(1.5deg)}30%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}32%,34%{-webkit-transform:translateY(1.5px) rotate(-.5deg);transform:translateY(1.5px) rotate(-.5deg)}36%{-webkit-transform:translateY(-1.5px) rotate(2.5deg);transform:translateY(-1.5px) rotate(2.5deg)}38%{-webkit-transform:translateY(1.5px) rotate(-1.5deg);transform:translateY(1.5px) rotate(-1.5deg)}40%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}42%{-webkit-transform:translateY(2.5px) rotate(-1.5deg);transform:translateY(2.5px) rotate(-1.5deg)}44%{-webkit-transform:translateY(1.5px) rotate(.5deg);transform:translateY(1.5px) rotate(.5deg)}46%{-webkit-transform:translateY(-1.5px) rotate(2.5deg);transform:translateY(-1.5px) rotate(2.5deg)}48%{-webkit-transform:translateY(-.5px) rotate(.5deg);transform:translateY(-.5px) rotate(.5deg)}50%{-webkit-transform:translateY(.5px) rotate(.5deg);transform:translateY(.5px) rotate(.5deg)}52%{-webkit-transform:translateY(2.5px) rotate(2.5deg);transform:translateY(2.5px) rotate(2.5deg)}54%{-webkit-transform:translateY(-1.5px) rotate(1.5deg);transform:translateY(-1.5px) rotate(1.5deg)}56%{-webkit-transform:translateY(2.5px) rotate(2.5deg);transform:translateY(2.5px) rotate(2.5deg)}58%{-webkit-transform:translateY(.5px) rotate(2.5deg);transform:translateY(.5px) rotate(2.5deg)}60%{-webkit-transform:translateY(2.5px) rotate(2.5deg);transform:translateY(2.5px) rotate(2.5deg)}62%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}64%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}66%{-webkit-transform:translateY(1.5px) rotate(-.5deg);transform:translateY(1.5px) rotate(-.5deg)}68%{-webkit-transform:translateY(-1.5px) rotate(-.5deg);transform:translateY(-1.5px) rotate(-.5deg)}70%{-webkit-transform:translateY(1.5px) rotate(.5deg);transform:translateY(1.5px) rotate(.5deg)}72%{-webkit-transform:translateY(2.5px) rotate(1.5deg);transform:translateY(2.5px) rotate(1.5deg)}74%{-webkit-transform:translateY(-.5px) rotate(.5deg);transform:translateY(-.5px) rotate(.5deg)}76%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}78%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}80%{-webkit-transform:translateY(1.5px) rotate(1.5deg);transform:translateY(1.5px) rotate(1.5deg)}82%{-webkit-transform:translateY(-.5px) rotate(.5deg);transform:translateY(-.5px) rotate(.5deg)}84%{-webkit-transform:translateY(1.5px) rotate(2.5deg);transform:translateY(1.5px) rotate(2.5deg)}86%{-webkit-transform:translateY(-1.5px) rotate(-1.5deg);transform:translateY(-1.5px) rotate(-1.5deg)}88%{-webkit-transform:translateY(-.5px) rotate(2.5deg);transform:translateY(-.5px) rotate(2.5deg)}90%{-webkit-transform:translateY(2.5px) rotate(-.5deg);transform:translateY(2.5px) rotate(-.5deg)}92%{-webkit-transform:translateY(.5px) rotate(-.5deg);transform:translateY(.5px) rotate(-.5deg)}94%{-webkit-transform:translateY(2.5px) rotate(.5deg);transform:translateY(2.5px) rotate(.5deg)}96%{-webkit-transform:translateY(-.5px) rotate(1.5deg);transform:translateY(-.5px) rotate(1.5deg)}98%{-webkit-transform:translateY(-1.5px) rotate(-.5deg);transform:translateY(-1.5px) rotate(-.5deg)}0%,to{-webkit-transform:translate(0) rotate(0deg);transform:translate(0) rotate(0deg)}} +.OwO { + position: relative; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none +} + +.OwO:hover .OwO-logo { + color: #444 +} + +.OwO.OwO-open .OwO-logo { + border-radius: 4px 4px 0 0; + border-bottom: none; + color: #444 +} + +.OwO.OwO-open .OwO-body { + height:160px; +} + +.OwO.OwO-up .OwO-body { + top: inherit; + bottom: 21px; + border-radius: 4px 4px 4px 0 +} + +.OwO.OwO-up .OwO-body .OwO-bar .OwO-packages li:nth-child(1) { + border-radius: 0 +} + +.OwO.OwO-up.OwO-open .OwO-logo { + border: 1px solid #ddd; + border-radius: 0 0 4px 4px; + border-top: none +} + +.OwO .OwO-logo { + position: relative; + display: inline-block; + color: #888; + background: #fff; + border: 1px solid #ddd; + border-radius: 4px; + font-size: 13px; + padding: 2px 5px; + cursor: pointer; + height: 22px; + box-sizing: border-box; + z-index: 2; + line-height: 16px +} + +.OwO .OwO-logo:hover span { + display: inline-block; + -webkit-animation: a 5s infinite ease-in-out; + animation: a 5s infinite ease-in-out +} + +.OwO .OwO-body { + transition:height 0.5s; + height:0; + overflow:hidden; + width: 400px; + z-index: 1; + top: 21px; + width:97%; +} + +.OwO .OwO-body .OwO-items { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + display: none; + padding: 10px; + margin: 0; + overflow: scroll; + font-size: 0 +} + +.OwO .OwO-body .OwO-items .OwO-item { + list-style-type: none; + padding: 5px 10px; + border-radius: 5px; + display: inline-block; + font-size: 12px; + line-height: 14px; + margin: 0 10px 12px 0; + cursor: pointer; + -webkit-transition: .3s; + transition: .3s +} + +.OwO .OwO-body .OwO-items .OwO-item:hover { + -webkit-animation: a 5s infinite ease-in-out; + animation: a 5s infinite ease-in-out; + transition:scale(1.02); +} + +.OwO .OwO-body .OwO-items-emoji .OwO-item { + font-size: 20px; + line-height: 19px +} + +.OwO .OwO-body .OwO-items-image .OwO-item { + max-width: calc(25% - 10px); + box-sizing: border-box +} + +.OwO .OwO-body .OwO-items-image .OwO-item img { + max-width: 100% +} + +.OwO .OwO-body .OwO-items-show { + display: block +} + +.OwO .OwO-body .OwO-bar { + width: 100%; + height: 30px; + border-top: 1px solid #ddd; + background: #fff; + border-radius: 0 0 4px 4px; + color: #444 +} + +.OwO .OwO-body .OwO-bar .OwO-packages { + margin: 0; + padding: 0; + font-size: 0 +} + +.OwO .OwO-body .OwO-bar .OwO-packages li { + list-style-type: none; + display: inline-block; + line-height: 30px; + font-size: 14px; + padding: 0 10px; + cursor: pointer; + margin-right: 3px +} + +.OwO .OwO-body .OwO-bar .OwO-packages li:nth-child(1) { + border-radius: 0 0 0 3px +} + +.OwO .OwO-body .OwO-bar .OwO-packages li:hover { + background: #eee +} + +.OwO .OwO-body .OwO-bar .OwO-packages .OwO-package-active { + background: #eee; + -webkit-transition: .3s; + transition: .3s +} + +@-webkit-keyframes a { + 2% { + -webkit-transform: translateY(1.5px) rotate(1.5deg); + transform: translateY(1.5px) rotate(1.5deg) + } + + 4% { + -webkit-transform: translateY(-1.5px) rotate(-.5deg); + transform: translateY(-1.5px) rotate(-.5deg) + } + + 6% { + -webkit-transform: translateY(1.5px) rotate(-1.5deg); + transform: translateY(1.5px) rotate(-1.5deg) + } + + 8% { + -webkit-transform: translateY(-1.5px) rotate(-1.5deg); + transform: translateY(-1.5px) rotate(-1.5deg) + } + + 10% { + -webkit-transform: translateY(2.5px) rotate(1.5deg); + transform: translateY(2.5px) rotate(1.5deg) + } + + 12% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 14% { + -webkit-transform: translateY(-1.5px) rotate(1.5deg); + transform: translateY(-1.5px) rotate(1.5deg) + } + + 16% { + -webkit-transform: translateY(-.5px) rotate(-1.5deg); + transform: translateY(-.5px) rotate(-1.5deg) + } + + 18% { + -webkit-transform: translateY(.5px) rotate(-1.5deg); + transform: translateY(.5px) rotate(-1.5deg) + } + + 20% { + -webkit-transform: translateY(-1.5px) rotate(2.5deg); + transform: translateY(-1.5px) rotate(2.5deg) + } + + 22% { + -webkit-transform: translateY(.5px) rotate(-1.5deg); + transform: translateY(.5px) rotate(-1.5deg) + } + + 24% { + -webkit-transform: translateY(1.5px) rotate(1.5deg); + transform: translateY(1.5px) rotate(1.5deg) + } + + 26% { + -webkit-transform: translateY(.5px) rotate(.5deg); + transform: translateY(.5px) rotate(.5deg) + } + + 28% { + -webkit-transform: translateY(.5px) rotate(1.5deg); + transform: translateY(.5px) rotate(1.5deg) + } + + 30% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 32%,34% { + -webkit-transform: translateY(1.5px) rotate(-.5deg); + transform: translateY(1.5px) rotate(-.5deg) + } + + 36% { + -webkit-transform: translateY(-1.5px) rotate(2.5deg); + transform: translateY(-1.5px) rotate(2.5deg) + } + + 38% { + -webkit-transform: translateY(1.5px) rotate(-1.5deg); + transform: translateY(1.5px) rotate(-1.5deg) + } + + 40% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 42% { + -webkit-transform: translateY(2.5px) rotate(-1.5deg); + transform: translateY(2.5px) rotate(-1.5deg) + } + + 44% { + -webkit-transform: translateY(1.5px) rotate(.5deg); + transform: translateY(1.5px) rotate(.5deg) + } + + 46% { + -webkit-transform: translateY(-1.5px) rotate(2.5deg); + transform: translateY(-1.5px) rotate(2.5deg) + } + + 48% { + -webkit-transform: translateY(-.5px) rotate(.5deg); + transform: translateY(-.5px) rotate(.5deg) + } + + 50% { + -webkit-transform: translateY(.5px) rotate(.5deg); + transform: translateY(.5px) rotate(.5deg) + } + + 52% { + -webkit-transform: translateY(2.5px) rotate(2.5deg); + transform: translateY(2.5px) rotate(2.5deg) + } + + 54% { + -webkit-transform: translateY(-1.5px) rotate(1.5deg); + transform: translateY(-1.5px) rotate(1.5deg) + } + + 56% { + -webkit-transform: translateY(2.5px) rotate(2.5deg); + transform: translateY(2.5px) rotate(2.5deg) + } + + 58% { + -webkit-transform: translateY(.5px) rotate(2.5deg); + transform: translateY(.5px) rotate(2.5deg) + } + + 60% { + -webkit-transform: translateY(2.5px) rotate(2.5deg); + transform: translateY(2.5px) rotate(2.5deg) + } + + 62% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 64% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 66% { + -webkit-transform: translateY(1.5px) rotate(-.5deg); + transform: translateY(1.5px) rotate(-.5deg) + } + + 68% { + -webkit-transform: translateY(-1.5px) rotate(-.5deg); + transform: translateY(-1.5px) rotate(-.5deg) + } + + 70% { + -webkit-transform: translateY(1.5px) rotate(.5deg); + transform: translateY(1.5px) rotate(.5deg) + } + + 72% { + -webkit-transform: translateY(2.5px) rotate(1.5deg); + transform: translateY(2.5px) rotate(1.5deg) + } + + 74% { + -webkit-transform: translateY(-.5px) rotate(.5deg); + transform: translateY(-.5px) rotate(.5deg) + } + + 76% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 78% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 80% { + -webkit-transform: translateY(1.5px) rotate(1.5deg); + transform: translateY(1.5px) rotate(1.5deg) + } + + 82% { + -webkit-transform: translateY(-.5px) rotate(.5deg); + transform: translateY(-.5px) rotate(.5deg) + } + + 84% { + -webkit-transform: translateY(1.5px) rotate(2.5deg); + transform: translateY(1.5px) rotate(2.5deg) + } + + 86% { + -webkit-transform: translateY(-1.5px) rotate(-1.5deg); + transform: translateY(-1.5px) rotate(-1.5deg) + } + + 88% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 90% { + -webkit-transform: translateY(2.5px) rotate(-.5deg); + transform: translateY(2.5px) rotate(-.5deg) + } + + 92% { + -webkit-transform: translateY(.5px) rotate(-.5deg); + transform: translateY(.5px) rotate(-.5deg) + } + + 94% { + -webkit-transform: translateY(2.5px) rotate(.5deg); + transform: translateY(2.5px) rotate(.5deg) + } + + 96% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 98% { + -webkit-transform: translateY(-1.5px) rotate(-.5deg); + transform: translateY(-1.5px) rotate(-.5deg) + } + + 0%,to { + -webkit-transform: translate(0) rotate(0deg); + transform: translate(0) rotate(0deg) + } +} + +@keyframes a { + 2% { + -webkit-transform: translateY(1.5px) rotate(1.5deg); + transform: translateY(1.5px) rotate(1.5deg) + } + + 4% { + -webkit-transform: translateY(-1.5px) rotate(-.5deg); + transform: translateY(-1.5px) rotate(-.5deg) + } + + 6% { + -webkit-transform: translateY(1.5px) rotate(-1.5deg); + transform: translateY(1.5px) rotate(-1.5deg) + } + + 8% { + -webkit-transform: translateY(-1.5px) rotate(-1.5deg); + transform: translateY(-1.5px) rotate(-1.5deg) + } + + 10% { + -webkit-transform: translateY(2.5px) rotate(1.5deg); + transform: translateY(2.5px) rotate(1.5deg) + } + + 12% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 14% { + -webkit-transform: translateY(-1.5px) rotate(1.5deg); + transform: translateY(-1.5px) rotate(1.5deg) + } + + 16% { + -webkit-transform: translateY(-.5px) rotate(-1.5deg); + transform: translateY(-.5px) rotate(-1.5deg) + } + + 18% { + -webkit-transform: translateY(.5px) rotate(-1.5deg); + transform: translateY(.5px) rotate(-1.5deg) + } + + 20% { + -webkit-transform: translateY(-1.5px) rotate(2.5deg); + transform: translateY(-1.5px) rotate(2.5deg) + } + + 22% { + -webkit-transform: translateY(.5px) rotate(-1.5deg); + transform: translateY(.5px) rotate(-1.5deg) + } + + 24% { + -webkit-transform: translateY(1.5px) rotate(1.5deg); + transform: translateY(1.5px) rotate(1.5deg) + } + + 26% { + -webkit-transform: translateY(.5px) rotate(.5deg); + transform: translateY(.5px) rotate(.5deg) + } + + 28% { + -webkit-transform: translateY(.5px) rotate(1.5deg); + transform: translateY(.5px) rotate(1.5deg) + } + + 30% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 32%,34% { + -webkit-transform: translateY(1.5px) rotate(-.5deg); + transform: translateY(1.5px) rotate(-.5deg) + } + + 36% { + -webkit-transform: translateY(-1.5px) rotate(2.5deg); + transform: translateY(-1.5px) rotate(2.5deg) + } + + 38% { + -webkit-transform: translateY(1.5px) rotate(-1.5deg); + transform: translateY(1.5px) rotate(-1.5deg) + } + + 40% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 42% { + -webkit-transform: translateY(2.5px) rotate(-1.5deg); + transform: translateY(2.5px) rotate(-1.5deg) + } + + 44% { + -webkit-transform: translateY(1.5px) rotate(.5deg); + transform: translateY(1.5px) rotate(.5deg) + } + + 46% { + -webkit-transform: translateY(-1.5px) rotate(2.5deg); + transform: translateY(-1.5px) rotate(2.5deg) + } + + 48% { + -webkit-transform: translateY(-.5px) rotate(.5deg); + transform: translateY(-.5px) rotate(.5deg) + } + + 50% { + -webkit-transform: translateY(.5px) rotate(.5deg); + transform: translateY(.5px) rotate(.5deg) + } + + 52% { + -webkit-transform: translateY(2.5px) rotate(2.5deg); + transform: translateY(2.5px) rotate(2.5deg) + } + + 54% { + -webkit-transform: translateY(-1.5px) rotate(1.5deg); + transform: translateY(-1.5px) rotate(1.5deg) + } + + 56% { + -webkit-transform: translateY(2.5px) rotate(2.5deg); + transform: translateY(2.5px) rotate(2.5deg) + } + + 58% { + -webkit-transform: translateY(.5px) rotate(2.5deg); + transform: translateY(.5px) rotate(2.5deg) + } + + 60% { + -webkit-transform: translateY(2.5px) rotate(2.5deg); + transform: translateY(2.5px) rotate(2.5deg) + } + + 62% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 64% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 66% { + -webkit-transform: translateY(1.5px) rotate(-.5deg); + transform: translateY(1.5px) rotate(-.5deg) + } + + 68% { + -webkit-transform: translateY(-1.5px) rotate(-.5deg); + transform: translateY(-1.5px) rotate(-.5deg) + } + + 70% { + -webkit-transform: translateY(1.5px) rotate(.5deg); + transform: translateY(1.5px) rotate(.5deg) + } + + 72% { + -webkit-transform: translateY(2.5px) rotate(1.5deg); + transform: translateY(2.5px) rotate(1.5deg) + } + + 74% { + -webkit-transform: translateY(-.5px) rotate(.5deg); + transform: translateY(-.5px) rotate(.5deg) + } + + 76% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 78% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 80% { + -webkit-transform: translateY(1.5px) rotate(1.5deg); + transform: translateY(1.5px) rotate(1.5deg) + } + + 82% { + -webkit-transform: translateY(-.5px) rotate(.5deg); + transform: translateY(-.5px) rotate(.5deg) + } + + 84% { + -webkit-transform: translateY(1.5px) rotate(2.5deg); + transform: translateY(1.5px) rotate(2.5deg) + } + + 86% { + -webkit-transform: translateY(-1.5px) rotate(-1.5deg); + transform: translateY(-1.5px) rotate(-1.5deg) + } + + 88% { + -webkit-transform: translateY(-.5px) rotate(2.5deg); + transform: translateY(-.5px) rotate(2.5deg) + } + + 90% { + -webkit-transform: translateY(2.5px) rotate(-.5deg); + transform: translateY(2.5px) rotate(-.5deg) + } + + 92% { + -webkit-transform: translateY(.5px) rotate(-.5deg); + transform: translateY(.5px) rotate(-.5deg) + } + + 94% { + -webkit-transform: translateY(2.5px) rotate(.5deg); + transform: translateY(2.5px) rotate(.5deg) + } + + 96% { + -webkit-transform: translateY(-.5px) rotate(1.5deg); + transform: translateY(-.5px) rotate(1.5deg) + } + + 98% { + -webkit-transform: translateY(-1.5px) rotate(-.5deg); + transform: translateY(-1.5px) rotate(-.5deg) + } + + 0%,to { + -webkit-transform: translate(0) rotate(0deg); + transform: translate(0) rotate(0deg) + } +} diff --git a/assets/js/id-transition.js b/assets/js/id-transition.js new file mode 100644 index 0000000..9355b69 --- /dev/null +++ b/assets/js/id-transition.js @@ -0,0 +1,18 @@ + $(function(){ + //锚点跳转滑动效果 + $('a[href*=#],area[href*=#]').click(function() { + console.log(this.pathname) + if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) { + var $target = $(this.hash); + $target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']'); + if ($target.length) { + var targetOffset = $target.offset().top; + $('html,body').animate({ + scrollTop: targetOffset + }, + 1000); + return false; + } + } + }); + }) -- cgit v1.2.3