From 467366b3788943eefbbd0c18fabbe23ac5692376 Mon Sep 17 00:00:00 2001 From: outtime Date: Thu, 19 Dec 2019 13:48:42 +0800 Subject: =?UTF-8?q?=F0=9F=8D=ADAdd=EF=BC=9A=E6=B7=BB=E5=8A=A0=E8=B9=A6?= =?UTF-8?q?=E8=B7=B6=E7=9A=84=E9=A2=9C=E6=96=87=E5=AD=97=E4=B8=8E=E5=BB=BA?= =?UTF-8?q?=E7=AB=99=E6=97=B6=E9=97=B4=E9=A1=B9=EF=BC=8C=E5=90=8C=E6=97=B6?= =?UTF-8?q?=E4=BC=98=E5=8C=96=E4=BA=86=E9=83=A8=E5=88=86=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/css/main/special.css | 249 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 249 insertions(+) (limited to 'assets/css/main/special.css') diff --git a/assets/css/main/special.css b/assets/css/main/special.css index 6b3c342..1ae2867 100644 --- a/assets/css/main/special.css +++ b/assets/css/main/special.css @@ -243,4 +243,253 @@ iframe[src*="//player.bilibili.com/player.html"] { } .fadein { opacity: 1; +} +/*底部动画字符*/ +.anime-face { + animation: anime-face 5s infinite ease-in-out; + display: inline-block; + margin: 0 5px; +} +@-webkit-keyframes anime-face { + 2%,24%,80% { + -webkit-transform: translate(0,1.5px) rotate(1.5deg); + transform: translate(0,1.5px) rotate(1.5deg) + } + + 4%,68%,98% { + -webkit-transform: translate(0,-1.5px) rotate(-.5deg); + transform: translate(0,-1.5px) rotate(-.5deg) + } + + 38%,6% { + -webkit-transform: translate(0,1.5px) rotate(-1.5deg); + transform: translate(0,1.5px) rotate(-1.5deg) + } + + 8%,86% { + -webkit-transform: translate(0,-1.5px) rotate(-1.5deg); + transform: translate(0,-1.5px) rotate(-1.5deg) + } + + 10%,72% { + -webkit-transform: translate(0,2.5px) rotate(1.5deg); + transform: translate(0,2.5px) rotate(1.5deg) + } + + 12%,64%,78%,96% { + -webkit-transform: translate(0,-.5px) rotate(1.5deg); + transform: translate(0,-.5px) rotate(1.5deg) + } + + 14%,54% { + -webkit-transform: translate(0,-1.5px) rotate(1.5deg); + transform: translate(0,-1.5px) rotate(1.5deg) + } + + 16% { + -webkit-transform: translate(0,-.5px) rotate(-1.5deg); + transform: translate(0,-.5px) rotate(-1.5deg) + } + + 18%,22% { + -webkit-transform: translate(0,.5px) rotate(-1.5deg); + transform: translate(0,.5px) rotate(-1.5deg) + } + + 20%,36%,46% { + -webkit-transform: translate(0,-1.5px) rotate(2.5deg); + transform: translate(0,-1.5px) rotate(2.5deg) + } + + 26%,50% { + -webkit-transform: translate(0,.5px) rotate(.5deg); + transform: translate(0,.5px) rotate(.5deg) + } + + 28% { + -webkit-transform: translate(0,.5px) rotate(1.5deg); + transform: translate(0,.5px) rotate(1.5deg) + } + + 30%,40%,62%,76%,88% { + -webkit-transform: translate(0,-.5px) rotate(2.5deg); + transform: translate(0,-.5px) rotate(2.5deg) + } + + 32%,34%,66% { + -webkit-transform: translate(0,1.5px) rotate(-.5deg); + transform: translate(0,1.5px) rotate(-.5deg) + } + + 42% { + -webkit-transform: translate(0,2.5px) rotate(-1.5deg); + transform: translate(0,2.5px) rotate(-1.5deg) + } + + 44%,70% { + -webkit-transform: translate(0,1.5px) rotate(.5deg); + transform: translate(0,1.5px) rotate(.5deg) + } + + 48%,74%,82% { + -webkit-transform: translate(0,-.5px) rotate(.5deg); + transform: translate(0,-.5px) rotate(.5deg) + } + + 52%,56%,60% { + -webkit-transform: translate(0,2.5px) rotate(2.5deg); + transform: translate(0,2.5px) rotate(2.5deg) + } + + 58% { + -webkit-transform: translate(0,.5px) rotate(2.5deg); + transform: translate(0,.5px) rotate(2.5deg) + } + + 84% { + -webkit-transform: translate(0,1.5px) rotate(2.5deg); + transform: translate(0,1.5px) rotate(2.5deg) + } + + 90% { + -webkit-transform: translate(0,2.5px) rotate(-.5deg); + transform: translate(0,2.5px) rotate(-.5deg) + } + + 92% { + -webkit-transform: translate(0,.5px) rotate(-.5deg); + transform: translate(0,.5px) rotate(-.5deg) + } + + 94% { + -webkit-transform: translate(0,2.5px) rotate(.5deg); + transform: translate(0,2.5px) rotate(.5deg) + } + + 0%,100% { + -webkit-transform: translate(0,0) rotate(0); + transform: translate(0,0) rotate(0) + } +} + +@keyframes anime-face { + 2%,24%,80% { + -webkit-transform: translate(0,1.5px) rotate(1.5deg); + transform: translate(0,1.5px) rotate(1.5deg) + } + + 4%,68%,98% { + -webkit-transform: translate(0,-1.5px) rotate(-.5deg); + transform: translate(0,-1.5px) rotate(-.5deg) + } + + 38%,6% { + -webkit-transform: translate(0,1.5px) rotate(-1.5deg); + transform: translate(0,1.5px) rotate(-1.5deg) + } + + 8%,86% { + -webkit-transform: translate(0,-1.5px) rotate(-1.5deg); + transform: translate(0,-1.5px) rotate(-1.5deg) + } + + 10%,72% { + -webkit-transform: translate(0,2.5px) rotate(1.5deg); + transform: translate(0,2.5px) rotate(1.5deg) + } + + 12%,64%,78%,96% { + -webkit-transform: translate(0,-.5px) rotate(1.5deg); + transform: translate(0,-.5px) rotate(1.5deg) + } + + 14%,54% { + -webkit-transform: translate(0,-1.5px) rotate(1.5deg); + transform: translate(0,-1.5px) rotate(1.5deg) + } + + 16% { + -webkit-transform: translate(0,-.5px) rotate(-1.5deg); + transform: translate(0,-.5px) rotate(-1.5deg) + } + + 18%,22% { + -webkit-transform: translate(0,.5px) rotate(-1.5deg); + transform: translate(0,.5px) rotate(-1.5deg) + } + + 20%,36%,46% { + -webkit-transform: translate(0,-1.5px) rotate(2.5deg); + transform: translate(0,-1.5px) rotate(2.5deg) + } + + 26%,50% { + -webkit-transform: translate(0,.5px) rotate(.5deg); + transform: translate(0,.5px) rotate(.5deg) + } + + 28% { + -webkit-transform: translate(0,.5px) rotate(1.5deg); + transform: translate(0,.5px) rotate(1.5deg) + } + + 30%,40%,62%,76%,88% { + -webkit-transform: translate(0,-.5px) rotate(2.5deg); + transform: translate(0,-.5px) rotate(2.5deg) + } + + 32%,34%,66% { + -webkit-transform: translate(0,1.5px) rotate(-.5deg); + transform: translate(0,1.5px) rotate(-.5deg) + } + + 42% { + -webkit-transform: translate(0,2.5px) rotate(-1.5deg); + transform: translate(0,2.5px) rotate(-1.5deg) + } + + 44%,70% { + -webkit-transform: translate(0,1.5px) rotate(.5deg); + transform: translate(0,1.5px) rotate(.5deg) + } + + 48%,74%,82% { + -webkit-transform: translate(0,-.5px) rotate(.5deg); + transform: translate(0,-.5px) rotate(.5deg) + } + + 52%,56%,60% { + -webkit-transform: translate(0,2.5px) rotate(2.5deg); + transform: translate(0,2.5px) rotate(2.5deg) + } + + 58% { + -webkit-transform: translate(0,.5px) rotate(2.5deg); + transform: translate(0,.5px) rotate(2.5deg) + } + + 84% { + -webkit-transform: translate(0,1.5px) rotate(2.5deg); + transform: translate(0,1.5px) rotate(2.5deg) + } + + 90% { + -webkit-transform: translate(0,2.5px) rotate(-.5deg); + transform: translate(0,2.5px) rotate(-.5deg) + } + + 92% { + -webkit-transform: translate(0,.5px) rotate(-.5deg); + transform: translate(0,.5px) rotate(-.5deg) + } + + 94% { + -webkit-transform: translate(0,2.5px) rotate(.5deg); + transform: translate(0,2.5px) rotate(.5deg) + } + + 0%,100% { + -webkit-transform: translate(0,0) rotate(0); + transform: translate(0,0) rotate(0) + } } \ No newline at end of file -- cgit v1.2.3