Lines in the first page
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Ekaropolus 2025-07-19 11:16:35 -06:00
parent 7f0d1578ad
commit 9bc0670474

View File

@ -1,3 +1,19 @@
// Generate vertical lines for .home__circles-lines
if ($('.home__circles-lines').length > 0) {
const count = 82;
const fragment = document.createDocumentFragment();
const div = document.createElement('div');
for (let i = 0; i < count; i++) {
fragment.appendChild(div.cloneNode(true));
}
$('.home__circles-lines').append(fragment);
console.log('✅ 82 divs added to .home__circles-lines');
} else {
console.warn('⚠️ .home__circles-lines not found in DOM');
}
/* 2.4 Home scroll animation */
$(window).on('load',function (){
$('#preloader').fadeOut(1500);
@ -10,6 +26,21 @@ $(window).on('load',function (){
gsap.to('.main--home', {duration: 0.5,autoAlpha: 1},0);
});
// Animación de líneas verticales
gsap.delayedCall(0.8, function () {
gsap.to(".home__circles-lines div", {
height: '100%',
opacity: 1,
duration: 2,
ease: "power2.out",
stagger: {
amount: 1,
from: "center"
}
});
});
let titles = gsap.utils.toArray(".page-title li"),
sections = gsap.utils.toArray(".scrollable"),
@ -191,18 +222,24 @@ console.log(
});
});
gsap.delayedCall(0.8, function () {
gsap.to(".home__circles-lines div", {height: '100%', duration: 2, opacity: 1});
const circlesLine = document.querySelector(".home__circles-lines div");
if (circlesLine) {
gsap.to(circlesLine, {height: '100%', duration: 2, opacity: 1});
} else {
console.warn("⚠️ Missing .home__circles-lines div — animation skipped.");
}
});
gsap.delayedCall(1, function () {
gsap.to(".home__circle--left", {left: '50%', duration: 2, opacity: 1});
gsap.to(".home__circle--right", {right: '50%', duration: 2, opacity: 1});
});
tl1.to(".home__circle--left, .home__circle--rigth", {
tl1.to(".home__circle--left, .home__circle--right", {
x: 0,
ease: "none"
}, 0);
//projects
let titlesProjects = gsap.utils.toArray(".projects .content__title > *");
titlesProjects.forEach((title, index) => {
@ -793,6 +830,8 @@ console.log(
gsap.set(titles, {y: "100%"});
gsap.set(titles[parseInt(link)], {y: "0"});
gsap.set(sections, {xPercent: -100 * parseInt(link), ease: "none"}, 0);
ScrollTrigger.refresh();
console.log('[✓] ScrollTrigger refreshed after menu click');
$('.header__menu li').removeClass('active');
$('.header__menu li').eq(parseInt(link)).addClass('active');