// Carousel auto-rotation + hover-flip (function init(){ var cards=document.querySelectorAll('.carousel-card'); if(!cards.length){setTimeout(init,500);return;} var cardArr=Array.from(cards),N=cardArr.length; var track=document.querySelector('.carousel-track'); if(track){track.style.position='relative';track.style.display='block';} var mid=Math.floor(N/2); cardArr.forEach(function(c,i){ var s=c.style; s.position='absolute';s.width='280px';s.height='360px'; s.left='50%';s.top='50%';s.marginLeft='-140px';s.marginTop='-180px'; s.cursor='pointer';s.transformOrigin='center center';s.willChange='transform,opacity'; c.setAttribute('data-pos',String(i-mid)); }); // 5 visible levels: 0(center) ±1 ±2 — smooth, continuous, no gaps var posCfg=[ {s:1,x:0,z:5,o:1}, // 0 {s:.85,x:220,z:4,o:.7}, // ±1 {s:.65,x:390,z:3,o:.4}, // ±2 {s:.45,x:520,z:2,o:.15}, // ±3 — dim edge {s:0,x:560,z:1,o:0} // ±4 — invisible, wrap point ]; function rotate(dir){ cardArr.forEach(function(c){ var p=parseInt(c.getAttribute('data-pos'))||0; var np=p-dir;if(np>4)np=-4;if(np<-4)np=4; c.setAttribute('data-pos',String(np)); }); cardArr.forEach(function(c){ var p=parseInt(c.getAttribute('data-pos'))||0; var a=Math.abs(p),d=posCfg[Math.min(a,4)],x=p>=0?d.x:-d.x; c.style.transition='all .6s cubic-bezier(.25,.1,.25,1)'; c.style.transform='translateX('+x+'px) scale('+d.s+')'; c.style.zIndex=d.z;c.style.opacity=d.o; c.style.pointerEvents=a>3?'none':'auto'; }); } rotate(0); cardArr.forEach(function(c){ c.addEventListener('mouseenter',function(){c.classList.add('flipped');}); c.addEventListener('mouseleave',function(){c.classList.remove('flipped');}); }); setInterval(function(){rotate(1);},3000); })();