Сердце Вселенной
/* Carousel Component CSS Version Made by hoah2333 Inspired form Carousel Component by Croquembouche */ :root { --base-roll-time: 0.5s; --base-wait-time: 5s; --img-2-time: calc(2 * (var(--base-roll-time) + var(--base-wait-time))); --img-3-time: calc(3 * (var(--base-roll-time) + var(--base-wait-time))); --img-4-time: calc(4 * (var(--base-roll-time) + var(--base-wait-time))); --img-5-time: calc(5 * (var(--base-roll-time) + var(--base-wait-time))); --img-6-time: calc(6 * (var(--base-roll-time) + var(--base-wait-time))); --navigator-mask: url(data:image/svg+xml;base64,PHN2ZyBpZD0i5Zu+5bGCXzEiIGRhdGEtbmFtZT0i5Zu+5bGCIDEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDIwIDIwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6IzIzMTgxNTt9PC9zdHlsZT48L2RlZnM+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iMjAiIGhlaWdodD0iNCIvPjxyZWN0IGNsYXNzPSJjbHMtMSIgeT0iOCIgd2lkdGg9IjIwIiBoZWlnaHQ9IjQiLz48cmVjdCBjbGFzcz0iY2xzLTEiIHk9IjE2IiB3aWR0aD0iMjAiIGhlaWdodD0iNCIvPjwvc3ZnPg==); } .carousel-container { position: relative; overflow: hidden; } .carousel-container .rolling { display: flex; flex-direction: column; height: 100%; position: relative; overflow: hidden; pointer-events: none; } .carousel-container .rolling br { display: none; } .carousel-container .rolling a:nth-of-type(1) { width: 100%; position: relative; } .carousel-container .rolling a:nth-of-type(2), .carousel-container .rolling a:nth-of-type(3), .carousel-container .rolling a:nth-of-type(4), .carousel-container .rolling a:nth-of-type(5), .carousel-container .rolling a:nth-of-type(6) { position: absolute; left: 100%; width: 100%; } .carousel-container .progress { position: absolute; bottom: 0; background: rgba(255, 255, 255, 0.7); box-sizing: border-box; backdrop-filter: blur(2px); height: 5px; left: 0; } /* ============== */ /* 图片切换动画部分 */ /* ============== */ .carousel-container .rolling.img-2 a:nth-of-type(1) { animation: rolling2-1 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-2 a:nth-of-type(2) { animation: rolling2-2 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling2-1 { 0% {left: 0;} /* 0s */ 4.54% {left: -100%;} /* 0.5s */ 49.99% {left: -100%;} 50% {left: 100%;} /* 5.5s */ 54.54% {left: 0;} /* 6s */ 100% {left: 0;} /* 11s */ } @keyframes rolling2-2 { 0% {left: 100%;} /* 0s */ 4.54% {left: 0;} /* 0.5s */ 50% {left: 0;} /* 5.5s */ 54.54% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 11s */ } .carousel-container .rolling.img-3 a:nth-of-type(1) { animation: rolling3-1 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-3 a:nth-of-type(2) { animation: rolling3-2 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-3 a:nth-of-type(3) { animation: rolling3-3 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling3-1 { 0% {left: 0;} /* 0s */ 3.03% {left: -100%;} /* 0.5s */ 66.65% {left: -100%;} 66.66% {left: 100%;} /* 11s */ 69.69% {left: 0;} /* 11.5s */ 100% {left: 0;} /* 16.5s */ } @keyframes rolling3-2 { 0% {left: 100%;} /* 0s */ 3.03% {left: 0;} /* 0.5s */ 33.33% {left: 0;} /* 5.5s */ 36.36% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 16.5s */ } @keyframes rolling3-3 { 0% {left: 100%;} /* 0s */ 33.33% {left: 100%;} /* 5.5s */ 36.36% {left: 0;} /* 6s */ 66.66% {left: 0;} /* 11s */ 69.69% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 16.5s */ } .carousel-container .rolling.img-4 a:nth-of-type(1) { animation: rolling4-1 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-4 a:nth-of-type(2) { animation: rolling4-2 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-4 a:nth-of-type(3) { animation: rolling4-3 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-4 a:nth-of-type(4) { animation: rolling4-4 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling4-1 { 0% {left: 0;} /* 0s */ 2.27% {left: -100%;} /* 0.5s */ 74.99% {left: -100%;} 75% {left: 100%;} /* 16.5s */ 77.27% {left: 0;} /* 17s */ 100% {left: 0;} /* 22s */ } @keyframes rolling4-2 { 0% {left: 100%;} /* 0s */ 2.27% {left: 0;} /* 0.5s */ 25% {left: 0;} /* 5.5s */ 27.27% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 22s */ } @keyframes rolling4-3 { 0% {left: 100%;} /* 0s */ 25% {left: 100%;} /* 5.5s */ 27.27% {left: 0;} /* 6s */ 50% {left: 0;} /* 11s */ 52.27% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 22s */ } @keyframes rolling4-4 { 0% {left: 100%;} /* 0s */ 50% {left: 100%;} /* 11s */ 52.27% {left: 0;} /* 11.5s */ 75% {left: 0;} /* 16.5s */ 77.27% {left: -100%;} /* 17s */ 99.99% {left: -100%} 100% {left: 100%;} /* 22s */ } .carousel-container .rolling.img-5 a:nth-of-type(1) { animation: rolling5-1 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(2) { animation: rolling5-2 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(3) { animation: rolling5-3 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(4) { animation: rolling5-4 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(5) { animation: rolling5-5 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling5-1 { 0% {left: 0;} /* 0s */ 1.82% {left: -100%;} /* 0.5s */ 79.99% {left: -100%;} 80% {left: 100%;} /* 22s */ 81.82% {left: 0;} /* 22.5s */ 100% {left: 0;} /* 27.5s */ } @keyframes rolling5-2 { 0% {left: 100%;} /* 0s */ 1.82% {left: 0;} /* 0.5s */ 20% {left: 0;} /* 5.5s */ 21.82% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 27.5s */ } @keyframes rolling5-3 { 0% {left: 100%;} /* 0s */ 20% {left: 100%;} /* 5.5s */ 21.82% {left: 0;} /* 6s */ 40% {left: 0;} /* 11s */ 41.82% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 27.5s */ } @keyframes rolling5-4 { 0% {left: 100%;} /* 0s */ 40% {left: 100%;} /* 11s */ 41.82% {left: 0;} /* 11.5s */ 60% {left: 0;} /* 16.5s */ 61.82% {left: -100%;} /* 17s */ 99.99% {left: -100%} 100% {left: 100%;} /* 27.5s */ } @keyframes rolling5-5 { 0% {left: 100%;} /* 0s */ 60% {left: 100%;} /* 16.5s */ 61.82% {left: 0;} /* 17s */ 80% {left: 0;} /* 22s */ 81.82% {left: -100%;} /* 22.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 27.5s */ } .carousel-container .rolling.img-6 a:nth-of-type(1) { animation: rolling6-1 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(2) { animation: rolling6-2 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(3) { animation: rolling6-3 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(4) { animation: rolling6-4 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(5) { animation: rolling6-5 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(5) { animation: rolling6-6 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling6-1 { 0% {left: 0;} /* 0s */ 1.51% {left: -100%;} /* 0.5s */ 79.99% {left: -100%;} 83.33% {left: 100%;} /* 27.5s */ 84.85% {left: 0;} /* 28s */ 100% {left: 0;} /* 33s */ } @keyframes rolling6-2 { 0% {left: 100%;} /* 0s */ 1.51% {left: 0;} /* 0.5s */ 16.67% {left: 0;} /* 5.5s */ 18.82% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-3 { 0% {left: 100%;} /* 0s */ 16.67% {left: 100%;} /* 5.5s */ 18.82% {left: 0;} /* 6s */ 33.33% {left: 0;} /* 11s */ 34.85% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-4 { 0% {left: 100%;} /* 0s */ 33.33% {left: 100%;} /* 11s */ 34.85% {left: 0;} /* 11.5s */ 50% {left: 0;} /* 16.5s */ 51.51% {left: -100%;} /* 17s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-5 { 0% {left: 100%;} /* 0s */ 50% {left: 100%;} /* 16.5s */ 51.51% {left: 0;} /* 17s */ 66.67% {left: 0;} /* 22s */ 68.18% {left: -100%;} /* 22.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-6 { 0% {left: 100%;} /* 0s */ 66.67% {left: 100%;} /* 22s */ 68.18% {left: 0;} /* 22.5s */ 83.33% {left: 0;} /* 27.5s */ 84.85% {left: -100%;} /* 28s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } /* ============ */ /* 进度条动画部分 */ /* ============ */ .carousel-container .progress.width-2, .carousel-container .progress.fake-2 { width: calc(100% / 2); } .carousel-container .progress.width-2 { animation: progress-2 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-2 { animation: fake-2 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-2 { 0% {left: 0;} /* 0s */ 4.54% {left: calc(100% / 2);} /* 0.5s */ 50% {left: calc(100% / 2);} /* 5.5s */ 54.54% {left: 100%;} /* 6s */ 99.99% {left: 100%;} 100% {left: 0;} /* 11s */ } @keyframes fake-2 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -2);} 50% {left: calc(100% / -2);} /* 5.5s */ 54.54% {left: 0;} /* 6s */ 100% {left: 0;} /* 11s */ } .carousel-container .progress.width-3, .carousel-container .progress.fake-3 { width: calc(100% / 3); } .carousel-container .progress.width-3 { animation: progress-3 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-3 { animation: fake-3 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-3 { 0% {left: 0;} /* 0s */ 3.03% {left: calc(100% / 3);} /* 0.5s */ 33% {left: calc(100% / 3);} /* 5.5s */ 36.36% {left: calc(100% / 3 * 2);} /* 6s */ 66.66% {left: calc(100% / 3 * 2);} /* 11s */ 69.69% {left: 100%;} /* 11.5s */ 99.99% {left: 100%;} 100% {left: 0;} /* 16.5s */ } @keyframes fake-3 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -3);} 66.66% {left: calc(100% / -3);} /* 11s */ 69.69% {left: 0;} /* 11.5s */ 100% {left: 0;} /* 16.5s */ } .carousel-container .progress.width-4, .carousel-container .progress.fake-4 { width: calc(100% / 4); } .carousel-container .progress.width-4 { animation: progress-4 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-4 { animation: fake-4 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-4 { 0% {left: 0;} /* 0s */ 2.27% {left: calc(100% / 4);} /* 0.5s */ 25% {left: calc(100% / 4);} /* 5.5s */ 27.27% {left: calc(100% / 4 * 2);} /* 6s */ 50% {left: calc(100% / 4 * 2);} /* 11s */ 52.27% {left: calc(100% / 4 * 3);} /* 11.5s */ 75% {left: calc(100% / 4 * 3)} /* 16.5s */ 77.27% {left: 100%;} /* 17s */ 99.99% {left: 100%;} 100% {left: 0;} /* 22s */ } @keyframes fake-4 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -4);} 75% {left: calc(100% / -4);} /* 16.5s */ 77.27% {left: 0;} /* 17s */ 100% {left: 0;} /* 22s */ } .carousel-container .progress.width-5, .carousel-container .progress.fake-5 { width: calc(100% / 5); } .carousel-container .progress.width-5 { animation: progress-5 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-5 { animation: fake-5 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-5 { 0% {left: 0;} /* 0s */ 1.82% {left: calc(100% / 5);} /* 0.5s */ 20% {left: calc(100% / 5);} /* 5.5s */ 21.82% {left: calc(100% / 5 * 2);} /* 6s */ 40% {left: calc(100% / 5 * 2);} /* 11s */ 41.82% {left: calc(100% / 5 * 3);} /* 11.5s */ 60% {left: calc(100% / 5 * 3)} /* 16.5s */ 61.82% {left: calc(100% / 5 * 4);} /* 17s */ 80% {left: calc(100% / 5 * 4);} /* 22s */ 81.82% {left: 100%;} /* 22.5s */ 99.99% {left: 100%;} 100% {left: 0;} /* 27.5s */ } @keyframes fake-5 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -5);} 80% {left: calc(100% / -5);} /* 22s */ 81.82% {left: 0;} /* 22.5s */ 100% {left: 0;} /* 27.5s */ } .carousel-container .progress.width-6, .carousel-container .progress.fake-6 { width: calc(100% / 6); } .carousel-container .progress.width-6 { animation: progress-6 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-6 { animation: fake-6 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-6 { 0% {left: 0;} /* 0s */ 1.51% {left: calc(100% / 6);} /* 0.5s */ 16.67% {left: calc(100% / 6);} /* 5.5s */ 18.82% {left: calc(100% / 6 * 2);} /* 6s */ 33.33% {left: calc(100% / 6 * 2);} /* 11s */ 34.85% {left: calc(100% / 6 * 3);} /* 11.5s */ 50% {left: calc(100% / 6 * 3)} /* 16.5s */ 51.51% {left: calc(100% / 6 * 4);} /* 17s */ 66.67% {left: calc(100% / 6 * 4);} /* 22s */ 68.18% {left: calc(100% / 6 * 5);} /* 22.5s */ 83.33% {left: calc(100% / 6 * 5);} /* 27.5s */ 84.85% {left: 100%;} /* 28s */ 99.99% {left: 100%;} 100% {left: 0;} /* 33s */ } @keyframes fake-6 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -6);} 83.33% {left: calc(100% / -6);} /* 27.5s */ 84.85% {left: 0;} /* 28s */ 100% {left: 0;} /* 33s */ } /* ========== */ /* 导航菜单部分 */ /* ========== */ .carousel-container .navigator { position: absolute; top: 0; left: 0; width: 50px; height: 50px; background-color: rgba(255, 255, 255, 0); transition: background-color 0.25s 0.25s cubic-bezier(0.4, 0, 0.2, 1), width 0.25s 0.5s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s 0.5s cubic-bezier(0.4, 0, 0.2, 1); } .carousel-container .navigator.none { display: none; } .carousel-container .navigator::before { content: ""; background-color: rgba(255, 255, 255, 0.7); position: absolute; width: 100%; height: 100%; -webkit-mask-size: 40%; mask-size: 40%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-image: var(--navigator-mask); mask-image: var(--navigator-mask); left: 0; transition: left 0.75s 0s linear; } .carousel-container .navigator:hover { background-color: rgba(255, 255, 255, 0.8); width: 100%; height: 100%; transition-delay: 0s; } .carousel-container .navigator:hover::before { left: -999vw; } .carousel-container .navigator .navigator-links { display: grid; position: absolute; left: -999vw; width: 100%; height: 100%; transition: left 0s 0.25s linear; } .carousel-container .navigator br { display: none; } .carousel-container .navigator:hover .navigator-links { left: 0; transition-delay: 0s; } .carousel-container .navigator .navigator-links.links-2 { grid-template-columns: 1fr; grid-template-rows: repeat(2, 1fr); } .carousel-container .navigator .navigator-links.links-3 { grid-template-columns: 1fr; grid-template-rows: repeat(3, 1fr); } .carousel-container .navigator .navigator-links.links-4 { grid-template-columns: 1fr; grid-template-rows: repeat(4, 1fr); } .carousel-container .navigator .navigator-links.links-5 { grid-template-columns: 1fr; grid-template-rows: repeat(5, 1fr); } .carousel-container .navigator .navigator-links.links-6 { grid-template-columns: 1fr; grid-template-rows: repeat(6, 1fr); } .carousel-container .navigator .navigator-links a { display: flex; position: relative; align-items: center; justify-content: left; box-sizing: border-box; border-left: 5px solid rgba(0, 0, 0, 0.4); padding-left: 10px; color: #3A3A3A; font-size: 1.15rem; text-decoration: none; clip-path: inset(0 0 100% 0); transition: clip-path 0.25s 0s cubic-bezier(0.4, 0, 0.2, 1); } .carousel-container .navigator:hover .navigator-links a { clip-path: inset(0); transition-delay: 0.25s; } /* 一个 a:not(a:last-of-type) 就能解决的事 */ .carousel-container .navigator .navigator-links a:nth-of-type(1), .carousel-container .navigator .navigator-links.links-3 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-4 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-4 a:nth-of-type(3), .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(3), .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(4), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(3), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(4), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(5) { border-bottom: 1px solid rgba(0, 0, 0, 0.4); } .carousel-container .navigator .navigator-links a::after { content: ""; position: absolute; width: 100%; height: 100%; left: -100%; top: 0; background-color: rgba(0, 0, 0, 0.2); transition: left 0.25s cubic-bezier(0.4, 0, 0.2, 1); } .carousel-container .navigator .navigator-links a:hover::after { left: 0; } /* ======== */ /* 移动端优化 */ /* ======== */ @media (max-width: 1024px) { .carousel-container .navigator .navigator-links a { font-size: 1rem; } } @media (max-width: 980px) { .carousel-container .navigator .navigator-links a { font-size: 0.75rem; } } @media (max-width: 526px) { .carousel-container .navigator .navigator-links.links-4 { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(2, 1fr); } .carousel-container .navigator .navigator-links.links-5, .carousel-container .navigator .navigator-links.links-6 { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr); } .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(5) { grid-column: 1 / 3; } } /* ======== */ /* 防呆不防傻 */ /* ======== */ .carousel-container [class*="$number"], .carousel-container .rolling a[href*="$link"], .carousel-container .navigator .navigator-links a[style*="$link"] { display: none; }
/* Carousel Component CSS Version Made by hoah2333 Inspired form Carousel Component by Croquembouche */ :root { --base-roll-time: 0.5s; --base-wait-time: 5s; --img-2-time: calc(2 * (var(--base-roll-time) + var(--base-wait-time))); --img-3-time: calc(3 * (var(--base-roll-time) + var(--base-wait-time))); --img-4-time: calc(4 * (var(--base-roll-time) + var(--base-wait-time))); --img-5-time: calc(5 * (var(--base-roll-time) + var(--base-wait-time))); --img-6-time: calc(6 * (var(--base-roll-time) + var(--base-wait-time))); --navigator-mask: url(data:image/svg+xml;base64,PHN2ZyBpZD0i5Zu+5bGCXzEiIGRhdGEtbmFtZT0i5Zu+5bGCIDEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDIwIDIwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6IzIzMTgxNTt9PC9zdHlsZT48L2RlZnM+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iMjAiIGhlaWdodD0iNCIvPjxyZWN0IGNsYXNzPSJjbHMtMSIgeT0iOCIgd2lkdGg9IjIwIiBoZWlnaHQ9IjQiLz48cmVjdCBjbGFzcz0iY2xzLTEiIHk9IjE2IiB3aWR0aD0iMjAiIGhlaWdodD0iNCIvPjwvc3ZnPg==); } .carousel-container { position: relative; overflow: hidden; } .carousel-container .rolling { display: flex; flex-direction: column; height: 100%; position: relative; overflow: hidden; pointer-events: none; } .carousel-container .rolling br { display: none; } .carousel-container .rolling a:nth-of-type(1) { width: 100%; position: relative; } .carousel-container .rolling a:nth-of-type(2), .carousel-container .rolling a:nth-of-type(3), .carousel-container .rolling a:nth-of-type(4), .carousel-container .rolling a:nth-of-type(5), .carousel-container .rolling a:nth-of-type(6) { position: absolute; left: 100%; width: 100%; } .carousel-container .progress { position: absolute; bottom: 0; background: rgba(255, 255, 255, 0.7); box-sizing: border-box; backdrop-filter: blur(2px); height: 5px; left: 0; } /* ============== */ /* 图片切换动画部分 */ /* ============== */ .carousel-container .rolling.img-2 a:nth-of-type(1) { animation: rolling2-1 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-2 a:nth-of-type(2) { animation: rolling2-2 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling2-1 { 0% {left: 0;} /* 0s */ 4.54% {left: -100%;} /* 0.5s */ 49.99% {left: -100%;} 50% {left: 100%;} /* 5.5s */ 54.54% {left: 0;} /* 6s */ 100% {left: 0;} /* 11s */ } @keyframes rolling2-2 { 0% {left: 100%;} /* 0s */ 4.54% {left: 0;} /* 0.5s */ 50% {left: 0;} /* 5.5s */ 54.54% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 11s */ } .carousel-container .rolling.img-3 a:nth-of-type(1) { animation: rolling3-1 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-3 a:nth-of-type(2) { animation: rolling3-2 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-3 a:nth-of-type(3) { animation: rolling3-3 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling3-1 { 0% {left: 0;} /* 0s */ 3.03% {left: -100%;} /* 0.5s */ 66.65% {left: -100%;} 66.66% {left: 100%;} /* 11s */ 69.69% {left: 0;} /* 11.5s */ 100% {left: 0;} /* 16.5s */ } @keyframes rolling3-2 { 0% {left: 100%;} /* 0s */ 3.03% {left: 0;} /* 0.5s */ 33.33% {left: 0;} /* 5.5s */ 36.36% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 16.5s */ } @keyframes rolling3-3 { 0% {left: 100%;} /* 0s */ 33.33% {left: 100%;} /* 5.5s */ 36.36% {left: 0;} /* 6s */ 66.66% {left: 0;} /* 11s */ 69.69% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 16.5s */ } .carousel-container .rolling.img-4 a:nth-of-type(1) { animation: rolling4-1 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-4 a:nth-of-type(2) { animation: rolling4-2 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-4 a:nth-of-type(3) { animation: rolling4-3 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-4 a:nth-of-type(4) { animation: rolling4-4 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling4-1 { 0% {left: 0;} /* 0s */ 2.27% {left: -100%;} /* 0.5s */ 74.99% {left: -100%;} 75% {left: 100%;} /* 16.5s */ 77.27% {left: 0;} /* 17s */ 100% {left: 0;} /* 22s */ } @keyframes rolling4-2 { 0% {left: 100%;} /* 0s */ 2.27% {left: 0;} /* 0.5s */ 25% {left: 0;} /* 5.5s */ 27.27% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 22s */ } @keyframes rolling4-3 { 0% {left: 100%;} /* 0s */ 25% {left: 100%;} /* 5.5s */ 27.27% {left: 0;} /* 6s */ 50% {left: 0;} /* 11s */ 52.27% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 22s */ } @keyframes rolling4-4 { 0% {left: 100%;} /* 0s */ 50% {left: 100%;} /* 11s */ 52.27% {left: 0;} /* 11.5s */ 75% {left: 0;} /* 16.5s */ 77.27% {left: -100%;} /* 17s */ 99.99% {left: -100%} 100% {left: 100%;} /* 22s */ } .carousel-container .rolling.img-5 a:nth-of-type(1) { animation: rolling5-1 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(2) { animation: rolling5-2 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(3) { animation: rolling5-3 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(4) { animation: rolling5-4 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-5 a:nth-of-type(5) { animation: rolling5-5 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling5-1 { 0% {left: 0;} /* 0s */ 1.82% {left: -100%;} /* 0.5s */ 79.99% {left: -100%;} 80% {left: 100%;} /* 22s */ 81.82% {left: 0;} /* 22.5s */ 100% {left: 0;} /* 27.5s */ } @keyframes rolling5-2 { 0% {left: 100%;} /* 0s */ 1.82% {left: 0;} /* 0.5s */ 20% {left: 0;} /* 5.5s */ 21.82% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 27.5s */ } @keyframes rolling5-3 { 0% {left: 100%;} /* 0s */ 20% {left: 100%;} /* 5.5s */ 21.82% {left: 0;} /* 6s */ 40% {left: 0;} /* 11s */ 41.82% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 27.5s */ } @keyframes rolling5-4 { 0% {left: 100%;} /* 0s */ 40% {left: 100%;} /* 11s */ 41.82% {left: 0;} /* 11.5s */ 60% {left: 0;} /* 16.5s */ 61.82% {left: -100%;} /* 17s */ 99.99% {left: -100%} 100% {left: 100%;} /* 27.5s */ } @keyframes rolling5-5 { 0% {left: 100%;} /* 0s */ 60% {left: 100%;} /* 16.5s */ 61.82% {left: 0;} /* 17s */ 80% {left: 0;} /* 22s */ 81.82% {left: -100%;} /* 22.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 27.5s */ } .carousel-container .rolling.img-6 a:nth-of-type(1) { animation: rolling6-1 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(2) { animation: rolling6-2 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(3) { animation: rolling6-3 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(4) { animation: rolling6-4 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(5) { animation: rolling6-5 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .rolling.img-6 a:nth-of-type(5) { animation: rolling6-6 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes rolling6-1 { 0% {left: 0;} /* 0s */ 1.51% {left: -100%;} /* 0.5s */ 79.99% {left: -100%;} 83.33% {left: 100%;} /* 27.5s */ 84.85% {left: 0;} /* 28s */ 100% {left: 0;} /* 33s */ } @keyframes rolling6-2 { 0% {left: 100%;} /* 0s */ 1.51% {left: 0;} /* 0.5s */ 16.67% {left: 0;} /* 5.5s */ 18.82% {left: -100%;} /* 6s */ 99.99% {left: -100%;} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-3 { 0% {left: 100%;} /* 0s */ 16.67% {left: 100%;} /* 5.5s */ 18.82% {left: 0;} /* 6s */ 33.33% {left: 0;} /* 11s */ 34.85% {left: -100%;} /* 11.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-4 { 0% {left: 100%;} /* 0s */ 33.33% {left: 100%;} /* 11s */ 34.85% {left: 0;} /* 11.5s */ 50% {left: 0;} /* 16.5s */ 51.51% {left: -100%;} /* 17s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-5 { 0% {left: 100%;} /* 0s */ 50% {left: 100%;} /* 16.5s */ 51.51% {left: 0;} /* 17s */ 66.67% {left: 0;} /* 22s */ 68.18% {left: -100%;} /* 22.5s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } @keyframes rolling6-6 { 0% {left: 100%;} /* 0s */ 66.67% {left: 100%;} /* 22s */ 68.18% {left: 0;} /* 22.5s */ 83.33% {left: 0;} /* 27.5s */ 84.85% {left: -100%;} /* 28s */ 99.99% {left: -100%} 100% {left: 100%;} /* 33s */ } /* ============ */ /* 进度条动画部分 */ /* ============ */ .carousel-container .progress.width-2, .carousel-container .progress.fake-2 { width: calc(100% / 2); } .carousel-container .progress.width-2 { animation: progress-2 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-2 { animation: fake-2 var(--img-2-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-2 { 0% {left: 0;} /* 0s */ 4.54% {left: calc(100% / 2);} /* 0.5s */ 50% {left: calc(100% / 2);} /* 5.5s */ 54.54% {left: 100%;} /* 6s */ 99.99% {left: 100%;} 100% {left: 0;} /* 11s */ } @keyframes fake-2 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -2);} 50% {left: calc(100% / -2);} /* 5.5s */ 54.54% {left: 0;} /* 6s */ 100% {left: 0;} /* 11s */ } .carousel-container .progress.width-3, .carousel-container .progress.fake-3 { width: calc(100% / 3); } .carousel-container .progress.width-3 { animation: progress-3 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-3 { animation: fake-3 var(--img-3-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-3 { 0% {left: 0;} /* 0s */ 3.03% {left: calc(100% / 3);} /* 0.5s */ 33% {left: calc(100% / 3);} /* 5.5s */ 36.36% {left: calc(100% / 3 * 2);} /* 6s */ 66.66% {left: calc(100% / 3 * 2);} /* 11s */ 69.69% {left: 100%;} /* 11.5s */ 99.99% {left: 100%;} 100% {left: 0;} /* 16.5s */ } @keyframes fake-3 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -3);} 66.66% {left: calc(100% / -3);} /* 11s */ 69.69% {left: 0;} /* 11.5s */ 100% {left: 0;} /* 16.5s */ } .carousel-container .progress.width-4, .carousel-container .progress.fake-4 { width: calc(100% / 4); } .carousel-container .progress.width-4 { animation: progress-4 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-4 { animation: fake-4 var(--img-4-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-4 { 0% {left: 0;} /* 0s */ 2.27% {left: calc(100% / 4);} /* 0.5s */ 25% {left: calc(100% / 4);} /* 5.5s */ 27.27% {left: calc(100% / 4 * 2);} /* 6s */ 50% {left: calc(100% / 4 * 2);} /* 11s */ 52.27% {left: calc(100% / 4 * 3);} /* 11.5s */ 75% {left: calc(100% / 4 * 3)} /* 16.5s */ 77.27% {left: 100%;} /* 17s */ 99.99% {left: 100%;} 100% {left: 0;} /* 22s */ } @keyframes fake-4 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -4);} 75% {left: calc(100% / -4);} /* 16.5s */ 77.27% {left: 0;} /* 17s */ 100% {left: 0;} /* 22s */ } .carousel-container .progress.width-5, .carousel-container .progress.fake-5 { width: calc(100% / 5); } .carousel-container .progress.width-5 { animation: progress-5 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-5 { animation: fake-5 var(--img-5-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-5 { 0% {left: 0;} /* 0s */ 1.82% {left: calc(100% / 5);} /* 0.5s */ 20% {left: calc(100% / 5);} /* 5.5s */ 21.82% {left: calc(100% / 5 * 2);} /* 6s */ 40% {left: calc(100% / 5 * 2);} /* 11s */ 41.82% {left: calc(100% / 5 * 3);} /* 11.5s */ 60% {left: calc(100% / 5 * 3)} /* 16.5s */ 61.82% {left: calc(100% / 5 * 4);} /* 17s */ 80% {left: calc(100% / 5 * 4);} /* 22s */ 81.82% {left: 100%;} /* 22.5s */ 99.99% {left: 100%;} 100% {left: 0;} /* 27.5s */ } @keyframes fake-5 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -5);} 80% {left: calc(100% / -5);} /* 22s */ 81.82% {left: 0;} /* 22.5s */ 100% {left: 0;} /* 27.5s */ } .carousel-container .progress.width-6, .carousel-container .progress.fake-6 { width: calc(100% / 6); } .carousel-container .progress.width-6 { animation: progress-6 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } .carousel-container .progress.fake-6 { animation: fake-6 var(--img-6-time) var(--base-wait-time) cubic-bezier(0.4, 0, 0.2, 1) infinite; } @keyframes progress-6 { 0% {left: 0;} /* 0s */ 1.51% {left: calc(100% / 6);} /* 0.5s */ 16.67% {left: calc(100% / 6);} /* 5.5s */ 18.82% {left: calc(100% / 6 * 2);} /* 6s */ 33.33% {left: calc(100% / 6 * 2);} /* 11s */ 34.85% {left: calc(100% / 6 * 3);} /* 11.5s */ 50% {left: calc(100% / 6 * 3)} /* 16.5s */ 51.51% {left: calc(100% / 6 * 4);} /* 17s */ 66.67% {left: calc(100% / 6 * 4);} /* 22s */ 68.18% {left: calc(100% / 6 * 5);} /* 22.5s */ 83.33% {left: calc(100% / 6 * 5);} /* 27.5s */ 84.85% {left: 100%;} /* 28s */ 99.99% {left: 100%;} 100% {left: 0;} /* 33s */ } @keyframes fake-6 { 0% {left: 0;} /* 0s */ 0.01% {left: calc(100% / -6);} 83.33% {left: calc(100% / -6);} /* 27.5s */ 84.85% {left: 0;} /* 28s */ 100% {left: 0;} /* 33s */ } /* ========== */ /* 导航菜单部分 */ /* ========== */ .carousel-container .navigator { position: absolute; top: 0; left: 0; width: 50px; height: 50px; background-color: rgba(255, 255, 255, 0); transition: background-color 0.25s 0.25s cubic-bezier(0.4, 0, 0.2, 1), width 0.25s 0.5s cubic-bezier(0.4, 0, 0.2, 1), height 0.25s 0.5s cubic-bezier(0.4, 0, 0.2, 1); } .carousel-container .navigator.none { display: none; } .carousel-container .navigator::before { content: ""; background-color: rgba(255, 255, 255, 0.7); position: absolute; width: 100%; height: 100%; -webkit-mask-size: 40%; mask-size: 40%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-image: var(--navigator-mask); mask-image: var(--navigator-mask); left: 0; transition: left 0.75s 0s linear; } .carousel-container .navigator:hover { background-color: rgba(255, 255, 255, 0.8); width: 100%; height: 100%; transition-delay: 0s; } .carousel-container .navigator:hover::before { left: -999vw; } .carousel-container .navigator .navigator-links { display: grid; position: absolute; left: -999vw; width: 100%; height: 100%; transition: left 0s 0.25s linear; } .carousel-container .navigator br { display: none; } .carousel-container .navigator:hover .navigator-links { left: 0; transition-delay: 0s; } .carousel-container .navigator .navigator-links.links-2 { grid-template-columns: 1fr; grid-template-rows: repeat(2, 1fr); } .carousel-container .navigator .navigator-links.links-3 { grid-template-columns: 1fr; grid-template-rows: repeat(3, 1fr); } .carousel-container .navigator .navigator-links.links-4 { grid-template-columns: 1fr; grid-template-rows: repeat(4, 1fr); } .carousel-container .navigator .navigator-links.links-5 { grid-template-columns: 1fr; grid-template-rows: repeat(5, 1fr); } .carousel-container .navigator .navigator-links.links-6 { grid-template-columns: 1fr; grid-template-rows: repeat(6, 1fr); } .carousel-container .navigator .navigator-links a { display: flex; position: relative; align-items: center; justify-content: left; box-sizing: border-box; border-left: 5px solid rgba(0, 0, 0, 0.4); padding-left: 10px; color: #3A3A3A; font-size: 1.15rem; text-decoration: none; clip-path: inset(0 0 100% 0); transition: clip-path 0.25s 0s cubic-bezier(0.4, 0, 0.2, 1); } .carousel-container .navigator:hover .navigator-links a { clip-path: inset(0); transition-delay: 0.25s; } /* 一个 a:not(a:last-of-type) 就能解决的事 */ .carousel-container .navigator .navigator-links a:nth-of-type(1), .carousel-container .navigator .navigator-links.links-3 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-4 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-4 a:nth-of-type(3), .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(3), .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(4), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(2), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(3), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(4), .carousel-container .navigator .navigator-links.links-6 a:nth-of-type(5) { border-bottom: 1px solid rgba(0, 0, 0, 0.4); } .carousel-container .navigator .navigator-links a::after { content: ""; position: absolute; width: 100%; height: 100%; left: -100%; top: 0; background-color: rgba(0, 0, 0, 0.2); transition: left 0.25s cubic-bezier(0.4, 0, 0.2, 1); } .carousel-container .navigator .navigator-links a:hover::after { left: 0; } /* ======== */ /* 移动端优化 */ /* ======== */ @media (max-width: 1024px) { .carousel-container .navigator .navigator-links a { font-size: 1rem; } } @media (max-width: 980px) { .carousel-container .navigator .navigator-links a { font-size: 0.75rem; } } @media (max-width: 526px) { .carousel-container .navigator .navigator-links.links-4 { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(2, 1fr); } .carousel-container .navigator .navigator-links.links-5, .carousel-container .navigator .navigator-links.links-6 { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr); } .carousel-container .navigator .navigator-links.links-5 a:nth-of-type(5) { grid-column: 1 / 3; } } /* ======== */ /* 防呆不防傻 */ /* ======== */ .carousel-container [class*="$number"], .carousel-container .rolling a[href*="$link"], .carousel-container .navigator .navigator-links a[style*="$link"] { display: none; }
Наглядная визуализация координат.
Описание:
Сердце Вселенной — это крупная аномальная структура, находящаяся в Гиннугагапе на координатах (0,0,0,456,4,9,31,33,246,68,141).1
Размышление:
Почему оно находится там?
Почему ось S? На ней больше ничего нет. Кроме него, на оси S нет ничего сколько-нибудь интересного. Оно находится в начале осей P, Q и R. Имеет ли это какое-нибудь значение?
Возможно, это не играет никакой роли. Вестибюль, самый важный из известных нам входов, находится в совершенно произвольной точке около оси V. В этих мирах нумерология никогда не обладала особой значимостью.
Анатомия:
Три группы, каждая из которых содержит одиннадцать биолюминесцирующих псевдосфер, вращаются вокруг большого аморфного ядра, имеющего форму полумесяца и сделанного из дрожащей меди. Ядро пульсирует с частотой приблизительно 108 ударов в минуту.
Кстати, интересный факт: данная частота соответствует текущему показателю смертности в мире — по одной смерти на каждые пять девятых секунды.
Удивительно.
Мелодия почти знакома. И ещё странно оптимистична.
Возможно, все мы каждый день слышим вокруг песнь смерти, не замечая этого. Мы настолько привыкли к проклятому сердцебиению этого колоссального аппарата, что можем услышать его только когда он находится прямо перед нами.
Но он всегда был прямо перед нами.
Каждые пять девятых секунды умирает человек.
А вселенная продолжает свою мерную веселую джигу, не думая о страданиях, через которые заставляет нас проходить.
Есть ли у него цель?
Возможно. Этот непостижимый сгусток связан с пространством и временем теми же стеклянными нитями, что и Первозданный. Нити образуют нечто, почти похожее на цепь шестерней, уходящих в бесконечную пустоту, так что у него явно есть какая-то функция в рамках естественного порядка вещей. Он может контролировать гравитацию, магнетизм, расширение вселенной или, вероятно, коллапс волновых функций. Он может быть причиной любого количества произвольных физических законов или процессов. Он может присваивать фундаментальным константам такие произвольные значения как "6.6743 × 10-11 м3 кг-1 с-2".
Но в конце концов, есть ли достаточно важная константа, чтобы оправдать его влияние?
Судьба:
Поверьте, я пытался уничтожить его, но этот порочный механизм продолжает биться.
Однажды я стану одним из этих ударов.
И ты тоже.
Возможно, это успокаивает? Знать, что твоя конечная жизнь получит новую цель: чтобы маятник мог качнуться ещё раз?
Возможно, это внушает чувство долга?
Это жалко. Обладай самоуважением. Ты — человек, божье творение, благословлённое сознанием, превосходящим окружающих тебя существ.
Держись за это. Не умирай спокойно в эту тихую ночь. Смерть — это проклятие, а проклятие можно снять.
Сейчас.
Ты со мной или нет?
~помощник
Aether48
Переводчик: Dawn of Ash
Читайте также
Уровень EN-(-10) Уровень EN-(-10)+4(+4/-0)
От Dawn of Ash, Создано 17 Jul 2023 18:28
Теги:загадочный сложность-выживания-4 уровень
Уровень EN-(-10) Уровень EN-(-10)
От Dawn of Ash, Создано 17 Jul 2023 18:28
Рейтинг:+4(+4/-0)
Теги:загадочный сложность-выживания-4 уровень
Могила Могила+11(+11/-0)
От Cranbe, Создано 23 Aug 2022 10:37
Теги:загадочный уровень
Могила Могила
От Cranbe, Создано 23 Aug 2022 10:37
Рейтинг:+11(+11/-0)
Теги:загадочный уровень
Уровень EN-76 — «Бескрайняя канализация» Уровень EN-76 — «Бескрайняя канализация»+9(+9/-0)
От Aerial7, Создано 10 Jul 2021 12:54
Теги:сложность-выживания-4 ужас уровень
Уровень EN-76 — «Бескрайняя канализация» Уровень EN-76 — «Бескрайняя канализация»
От Aerial7, Создано 10 Jul 2021 12:54
Рейтинг:+9(+9/-0)
Теги:сложность-выживания-4 ужас уровень
Что это такое?
Footnotes
1. Я понимаю, что большинству людей трудно попервой осмыслить 11-мерное пространство, поэтому добавил диаграмму, помогающую визуализировать его расположение относительно каждой координаты.
Однако не переживайте по этому поводу слишком сильно. Где это устройство расположено относительно точки начала космоса, в великой схеме вещей имеет не слишком большое значение.
Однако не переживайте по этому поводу слишком сильно. Где это устройство расположено относительно точки начала космоса, в великой схеме вещей имеет не слишком большое значение.
версия страницы: 1, Последняя правка: 22 Jul 2023 10:34
Редактировать по частям
Добавить
Метаинформация
Наблюдатели
Обратные ссылки
Исходник страницы
Родитель
Заблокировать страницу
Переименовать
Удалить