{"id":956,"date":"2026-08-18T16:07:35","date_gmt":"2026-08-18T16:07:35","guid":{"rendered":"https:\/\/www.labenze.com\/jupiterx-codes\/testimonial-show-js\/"},"modified":"2026-08-18T16:07:35","modified_gmt":"2026-08-18T16:07:35","slug":"testimonial-show-js","status":"publish","type":"jupiterx-codes","link":"https:\/\/www.labenze.com\/eng\/jupiterx-codes\/testimonial-show-js\/","title":{"rendered":"Testimonial show &#8211; JS"},"content":{"rendered":"<p><script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.2\/gsap.min.js\"><\/script><br \/>\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.2\/ScrollTrigger.min.js\"><\/script><\/p>\n<p><script>\n(function() {\n    function iniciarValidacionScroll() {\n        console.log(\"\ud83d\udd0d [Scroll Reveal] Comprobando librer\u00edas...\");<\/p>\n<p>        \/\/ 1. Validar si las librer\u00edas ya se cargaron en el navegador\n        if (typeof gsap === 'undefined' || typeof ScrollTrigger === 'undefined') {\n            console.warn(\"\u23f3 [Scroll Reveal] GSAP o ScrollTrigger no est\u00e1n listos a\u00fan. Reintentando en 100ms...\");\n            setTimeout(iniciarValidacionScroll, 100);\n            return;\n        }<\/p>\n<p>        console.log(\"\u2705 [Scroll Reveal] Librer\u00edas listas. Buscando clase '.texto-scroll-reveal'...\");<\/p>\n<p>        \/\/ 2. Validar si encuentra el contenedor con la clase\n        const targetContainer = document.querySelector('.texto-scroll-reveal');\n        if (!targetContainer) {\n            console.error(\"\u274c [Scroll Reveal] ERROR: No se encontr\u00f3 ning\u00fan elemento en la p\u00e1gina con la clase 'texto-scroll-reveal'. Revisa que est\u00e9 bien escrita en Elementor.\");\n            return;\n        }<\/p>\n<p>        \/\/ 3. Buscar el contenedor de texto interno de Elementor (Universal para cualquier widget)\n        let textWidget = targetContainer.querySelector('.elementor-widget-container');\n        if (!textWidget) textWidget = targetContainer;<\/p>\n<p>        const rawText = textWidget.textContent.trim();\n        if (!rawText) {\n            console.error(\"\u274c [Scroll Reveal] ERROR: Se encontr\u00f3 la clase, pero el widget est\u00e1 vac\u00edo o no tiene texto.\");\n            return;\n        }<\/p>\n<p>        console.log(\"\u2705 [Scroll Reveal] Texto detectado con \u00e9xito. Aplicando divisi\u00f3n de palabras...\");<\/p>\n<p>        \/\/ 4. Dividir el texto en palabras separadas\n        const words = rawText.split(\/s+\/);\n        textWidget.innerHTML = words.map(word => `<span class=\"word\">${word}<\/span>`).join(\" \");<\/p>\n<p>        \/\/ Registrar el plugin de scroll\n        gsap.registerPlugin(ScrollTrigger);<\/p>\n<p>        \/\/ Seleccionar las palabras creadas\n        const wordSpans = textWidget.querySelectorAll('.word');<\/p>\n<p>        \/\/ 5. Crear la animaci\u00f3n\n        gsap.to(wordSpans, {\n            opacity: 1,\n            stagger: 0.1,\n            scrollTrigger: {\n                trigger: textWidget,\n                start: \"top 85%\",\n                end: \"top 40%\",\n                scrub: true,\n                markers: false \/\/ Si lo cambias a true, ver\u00e1s l\u00edneas de gu\u00eda en la pantalla para pruebas\n            }\n        });<\/p>\n<p>        console.log(\"\ud83d\ude80 [Scroll Reveal] \u00a1Animaci\u00f3n vinculada y corriendo con \u00e9xito!\");\n    }<\/p>\n<p>    \/\/ Esperar a que la p\u00e1gina cargue todos los recursos pesados antes de iniciar\n    if (document.readyState === 'complete') {\n        iniciarValidacionScroll();\n    } else {\n        window.addEventListener('load', iniciarValidacionScroll);\n    }\n})();\n<\/script><\/p>\n","protected":false},"author":2,"template":"","meta":{"_acf_changed":false},"class_list":["post-956","jupiterx-codes","type-jupiterx-codes","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.labenze.com\/eng\/wp-json\/wp\/v2\/jupiterx-codes\/956","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.labenze.com\/eng\/wp-json\/wp\/v2\/jupiterx-codes"}],"about":[{"href":"https:\/\/www.labenze.com\/eng\/wp-json\/wp\/v2\/types\/jupiterx-codes"}],"author":[{"embeddable":true,"href":"https:\/\/www.labenze.com\/eng\/wp-json\/wp\/v2\/users\/2"}],"wp:attachment":[{"href":"https:\/\/www.labenze.com\/eng\/wp-json\/wp\/v2\/media?parent=956"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}