otros:agradecimientos
Diferencias
Muestra las diferencias entre dos versiones de la página.
| Ambos lados, revisión anteriorRevisión previaPróxima revisión | Revisión previa | ||
| otros:agradecimientos [2026/05/06 17:16] – jesus | otros:agradecimientos [2026/05/06 17:28] (actual) – jesus | ||
|---|---|---|---|
| Línea 2: | Línea 2: | ||
| < | < | ||
| < | < | ||
| - | #pcw_theater_final | + | #pcw_theater_system |
| background-color: | background-color: | ||
| height: 600px; width: 100%; overflow: hidden; position: relative; | height: 600px; width: 100%; overflow: hidden; position: relative; | ||
| Línea 8: | Línea 8: | ||
| } | } | ||
| - | /* --- LÍDER | + | /* --- LÍDER |
| #pcw_leader { | #pcw_leader { | ||
| position: absolute; inset: 0; background: #1a1a1a; z-index: 200; | position: absolute; inset: 0; background: #1a1a1a; z-index: 200; | ||
| display: flex; flex-direction: | display: flex; flex-direction: | ||
| } | } | ||
| - | .pcw_disc | + | |
| - | width: | + | .pcw_brand_main { color: #0f0; font-size: 3.2em; font-weight: |
| + | |||
| + | | ||
| + | width: | ||
| position: relative; display: flex; align-items: | position: relative; display: flex; align-items: | ||
| - | background: #000; overflow: hidden; | + | background: #000; overflow: hidden; box-shadow: 0 0 30px rgba(255, |
| } | } | ||
| - | | + | |
| + | /* Anillos concéntricos técnicos */ | ||
| + | | ||
| + | .pcw_ring_inner { position: absolute; width: 240px; height: 240px; border: 2px solid rgba(255, | ||
| + | |||
| + | /* Cruceta de mira telescópica */ | ||
| + | .pcw_axis_v { position: absolute; width: 2px; height: 100%; background: #fff; left: 50%; opacity: 0.4; } | ||
| + | .pcw_axis_h { position: absolute; height: 2px; width: 100%; background: #fff; top: 50%; opacity: 0.4; } | ||
| + | |||
| + | /* Aguja de reloj (Barrido de luz) */ | ||
| + | .pcw_clock_hand | ||
| position: absolute; width: 100%; height: 100%; | position: absolute; width: 100%; height: 100%; | ||
| - | background: conic-gradient(rgba(255, | + | background: conic-gradient(rgba(255, |
| - | animation: | + | |
| } | } | ||
| - | @keyframes | + | @keyframes |
| - | + | ||
| - | .pcw_cross_v { position: absolute; width: 2px; height: 100%; background: #fff; left: 50%; opacity: 0.3; } | + | |
| - | .pcw_cross_h { position: absolute; height: 2px; width: 100%; background: #fff; top: 50%; opacity: 0.3; } | + | |
| - | #pcw_num { color: #fff; font-size: 160px; font-weight: | + | #pcw_num { color: #fff; font-size: 160px; font-weight: |
| /* --- MOTOR DE SCROLL --- */ | /* --- MOTOR DE SCROLL --- */ | ||
| Línea 41: | Línea 51: | ||
| </ | </ | ||
| - | <div id="pcw_theater_final"> | + | <div id="pcw_theater_system"> |
| - | < | + | < |
| <div id=" | <div id=" | ||
| - | < | + | < |
| - | <div class=" | + | <div class=" |
| - | <div class=" | + | <div class=" |
| - | <div class=" | + | <div class=" |
| + | <div class=" | ||
| + | <div class=" | ||
| + | | ||
| <div id=" | <div id=" | ||
| </ | </ | ||
| - | <div style=" | + | < |
| </ | </ | ||
| - | < | + | < |
| <div id=" | <div id=" | ||
| <div style=" | <div style=" | ||
| - | <h1 style=" | + | <h1 style=" |
| <p style=" | <p style=" | ||
| </ | </ | ||
| | | ||
| <div id=" | <div id=" | ||
| - | <!-- LISTADO COMPLETO REVISADO --> | ||
| <div class=" | <div class=" | ||
| <div class=" | <div class=" | ||
| Línea 75: | Línea 87: | ||
| </ | </ | ||
| - | < | + | <div style=" |
| </ | </ | ||
| </ | </ | ||
| < | < | ||
| - | let posY = 600, engineOn = false; | + | let posY = 600, engineOn = false, firstRun = true; |
| function start() { | function start() { | ||
| - | const leader = document.getElementById(' | + | const leader = document.getElementById(' |
| - | canvas = document.getElementById(' | + | |
| - | num = document.getElementById(' | + | |
| | | ||
| - | engineOn = false; | + | engineOn = false; |
| posY = 600; | posY = 600; | ||
| - | | + | |
| - | | + | if (firstRun) { |
| - | | + | |
| - | + | leader.style.display = ' | |
| - | | + | let c = 3; num.innerText = c; |
| - | let timer = setInterval(() => { | + | let timer = setInterval(() => { |
| - | c--; | + | c--; |
| - | if (c > 0) num.innerText = c; | + | if (c > 0) num.innerText = c; |
| - | else { | + | else { |
| - | clearInterval(timer); | + | clearInterval(timer); |
| - | leader.style.display = ' | + | leader.style.display = ' |
| - | canvas.style.display = ' | + | canvas.style.display = ' |
| - | engineOn = true; | + | engineOn = true; |
| - | tick(); | + | |
| - | } | + | |
| - | }, 1000); | + | } |
| + | }, 1000); | ||
| + | } else { | ||
| + | leader.style.display = ' | ||
| + | canvas.style.display = ' | ||
| + | engineOn = true; | ||
| + | tick(); | ||
| + | } | ||
| } | } | ||
| function tick() { | function tick() { | ||
| if (!engineOn) return; | if (!engineOn) return; | ||
| - | posY -= 1.1; // Velocidad de desfile | + | posY -= 0.55; // VELOCIDAD ULTRA LENTA DE LECTURA |
| - | document.getElementById(' | + | |
| + | canvas.style.top = posY + ' | ||
| | | ||
| - | | + | if (Math.abs(posY) > (canvas.offsetHeight)) { |
| - | const canvasHeight = document.getElementById(' | + | |
| - | | + | |
| engineOn = false; | engineOn = false; | ||
| - | // BUCLE INSTANTÁNEO: | ||
| start(); | start(); | ||
| } else { | } else { | ||
| Línea 126: | Línea 143: | ||
| </ | </ | ||
| </ | </ | ||
| - | |||
otros/agradecimientos.1778087782.txt.gz · Última modificación: por jesus
