{"html":"

\n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n\n

\n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n

\n","css":".loader {\n scale: 0.75;\n position: relative;\n width: 200px;\n height: 200px;\n translate: 10px -20px;\n}\n.loader svg {\n position: absolute;\n top: 0;\n left: 0;\n}\n.head {\n translate: 27px -30px;\n z-index: 3;\n animation: bob 1s infinite ease-in;\n}\n.bod {\n translate: 0px 30px;\n z-index: 3;\n animation: bob 1s infinite ease-in-out;\n}\n.legr {\n translate: 75px 135px;\n z-index: 0;\n animation: rstep 1s infinite ease-in;\n}\n.legr {\n animation-delay: 0.45s;\n}\n\n.legl {\n translate: 30px 155px;\n z-index: 3;\n animation: lstep 1s infinite ease-in;\n}\n\n@keyframes bob {\n 0% {\n transform: translateY(0) rotate(3deg);\n }\n 5% {\n transform: translateY(0) rotate(3deg);\n }\n 25% {\n transform: translateY(5px) rotate(0deg);\n }\n 50% {\n transform: translateY(0px) rotate(-3deg);\n }\n 70% {\n transform: translateY(5px) rotate(0deg);\n }\n 100% {\n transform: translateY(0) rotate(3deg);\n }\n}\n\n@keyframes lstep {\n 0% {\n transform: translateY(0) rotate(-5deg);\n }\n 33% {\n transform: translateY(-15px) translate(32px) rotate(35deg);\n }\n 66% {\n transform: translateY(0) translate(25px) rotate(-25deg);\n }\n 100% {\n transform: translateY(0) rotate(-5deg);\n }\n}\n\n@keyframes rstep {\n 0% {\n transform: translateY(0) translate(0px) rotate(-5deg);\n }\n 33% {\n transform: translateY(-10px) translate(30px) rotate(35deg);\n }\n 66% {\n transform: translateY(0) translate(20px) rotate(-25deg);\n }\n 100% {\n transform: translateY(0) translate(0px) rotate(-5deg);\n }\n}\n\n#gnd {\n translate: -140px 0;\n rotate: 10deg;\n z-index: -1;\n filter: blur(0.5px) drop-shadow(1px 3px 5px #000000);\n opacity: 0.25;\n animation: scroll 5s infinite linear;\n}\n\n@keyframes scroll {\n 0% {\n transform: translateY(25px) translate(50px);\n opacity: 0;\n }\n 33% {\n opacity: 0.25;\n }\n 66% {\n opacity: 0.25;\n }\n to {\n transform: translateY(-50px) translate(-100px);\n opacity: 0;\n }\n}\n"}

lazy-quail-10

👁 实时预览

📝 源代码