|
|
| (не показаны 2 промежуточные версии этого же участника) |
| Строка 1: |
Строка 1: |
| <div id="orbitalis-parallax-bg" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; overflow: hidden; background: #060608;"> | | <div id="orbitalis-parallax-bg"> </div><div id="parallax-nebula" class=" orb- parallax- layer"></div><div id="parallax-stars-small" class=" orb- parallax- layer"></div><div id="parallax-stars-big" class=" orb- parallax- layer"></div><div id=" orbitalis- vignette"></div> |
| <div id="parallax-nebula" style=" position: absolute; top: - 50px; left: -50px; width: calc(100% + 100px); height: calc(100% + 100px); background: radial-gradient(ellipse at 70% 40%, rgba(30,50,80,0.4) 0%, transparent 50%), radial-gradient(ellipse at 85% 60%, rgba(50,30,60,0.3) 0%, transparent 45%), radial- gradient(ellipse at 60% 70%, rgba(20,40,70,0.35) 0%, transparent 55%); opacity: 0.7;"></div> | | {{ Mainpage/splash }} |
| <div id="parallax-stars-small" style=" position: absolute; top: - 50px; left: -50px; width: calc(100% + 100px); height: calc(100% + 100px); background-image: radial-gradient(1px 1px at 10% 20%, rgba(255,255,255,0.8), transparent), radial-gradient(1px 1px at 25% 35%, rgba(255,255,255,0.6), transparent), radial-gradient(1px 1px at 40% 10%, rgba(255,255,255,0.7), transparent), radial-gradient(1px 1px at 55% 45%, rgba(255,255,255,0.5), transparent), radial-gradient(1px 1px at 70% 25%, rgba(255,255,255,0.8), transparent), radial-gradient(1px 1px at 85% 55%, rgba(255,255,255,0.6), transparent), radial-gradient(1px 1px at 15% 60%, rgba(255,255,255,0.7), transparent), radial-gradient(1px 1px at 30% 75%, rgba(255,255,255,0.5), transparent), radial-gradient(1px 1px at 45% 85%, rgba(255,255,255,0.8), transparent), radial-gradient(1px 1px at 60% 70%, rgba(255,255,255,0.6), transparent), radial-gradient(1px 1px at 75% 90%, rgba(255,255,255,0.7), transparent), radial-gradient(1px 1px at 90% 15%, rgba(255,255,255,0.5), transparent), radial-gradient(1px 1px at 5% 40%, rgba(255,255,255,0.6), transparent), radial-gradient(1px 1px at 20% 95%, rgba(255,255,255,0.7), transparent), radial-gradient(1px 1px at 35% 50%, rgba(255,255,255,0.5), transparent), radial-gradient(1px 1px at 50% 30%, rgba(255,255,255,0.8), transparent), radial-gradient(1px 1px at 65% 5%, rgba(255,255,255,0.6), transparent), radial-gradient(1px 1px at 80% 65%, rgba(255,255,255,0.7), transparent), radial-gradient(1px 1px at 95% 80%, rgba(255,255,255,0.5), transparent), radial-gradient(1px 1px at 12% 88%, rgba(255,255,255,0.6), transparent); background- size: 200px 200px; opacity: 0.8;"></div> | |
| <div id="parallax-stars-big" style=" position: absolute; top: - 50px; left: -50px; width: calc(100% + 100px); height: calc(100% + 100px); background-image: radial-gradient(2px 2px at 8% 15%, rgba(200,220,255,0.9), transparent), radial-gradient(2px 2px at 22% 42%, rgba(255,240,220,0.8), transparent), radial-gradient(2px 2px at 38% 8%, rgba(220,255,255,0.7), transparent), radial-gradient(2px 2px at 52% 68%, rgba(255,255,220,0.8), transparent), radial-gradient(2px 2px at 68% 32%, rgba(200,200,255,0.9), transparent), radial-gradient(2px 2px at 82% 78%, rgba(255,220,200,0.7), transparent), radial-gradient(2px 2px at 18% 55%, rgba(220,255,220,0.8), transparent), radial- gradient(2px 2px at 48% 92%, rgba(255,200,255,0.7), transparent), radial-gradient(2px 2px at 72% 18%, rgba(200,255,255,0.8), transparent), radial-gradient(2px 2px at 92% 45%, rgba(255,255,200,0.7), transparent); background-size: 300px 300px; opacity: 0.6;"></div> | |
| </div> | |
| <div style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; background: radial-gradient(ellipse at center, rgba(6,6,8,0) 30%, rgba(6,6,8,0.6) 70%, #060608 100%);"></div>
| |
| <script>
| |
| (function() {
| |
| var nebulaEl = document.getElementById('parallax-nebula');
| |
| var starsSmallEl = document.getElementById('parallax-stars-small');
| |
| var starsBigEl = document.getElementById('parallax-stars-big');
| |
| var targetX = 0, targetY = 0;
| |
| var currentX = 0, currentY = 0;
| |
| document.addEventListener('mousemove', function(e) {
| |
| var w = window.innerWidth || document.documentElement.clientWidth;
| |
| var h = window.innerHeight || document.documentElement.clientHeight;
| |
| targetX = (e.clientX / w - 0.5) * 2;
| |
| targetY = (e.clientY / h - 0.5) * 2;
| |
| });
| |
| var animate = function() {
| |
| currentX += (targetX - currentX) * 0.06;
| |
| currentY += (targetY - currentY) * 0.06;
| |
| if (nebulaEl) { nebulaEl.style.left = (currentX * 12 - 50) + 'px'; nebulaEl.style.top = (currentY * 12 - 50) + 'px'; }
| |
| if (starsSmallEl) { starsSmallEl.style.left = (currentX * 25 - 50) + 'px'; starsSmallEl.style.top = (currentY * 25 - 50) + 'px'; }
| |
| if (starsBigEl) { starsBigEl.style.left = (currentX * 40 - 50) + 'px'; starsBigEl.style.top = (currentY * 40 - 50) + 'px'; }
| |
| requestAnimationFrame(animate);
| |
| };
| |
| animate();
| |
| /* Override wiki body background */
| |
| document.body.style.background = '#060608';
| |
| var mwBody = document.getElementById('mw-page-base');
| |
| if (mwBody) mwBody.style.background = 'none';
| |
| var mwHead = document.getElementById('mw-head-base');
| |
| if (mwHead) mwHead.style.background = 'none';
| |
| var content = document.getElementById('content');
| |
| if (content) { content.style.background = 'none'; content.style.border = 'none'; }
| |
| var bodyContent = document.getElementById('bodyContent');
| |
| if (bodyContent) { bodyContent.style.position = 'relative'; bodyContent.style.zIndex = '5'; }
| |
| })();
| |
| </script>
| |
| | |
| {{ Mainpage / splash }} | |
| <br /> | | <br /> |
| {{ Pagegen }} | | {{ Pagegen }} |
| [[Категория:В разработке]]
| |
