File size: 698 Bytes
dd2a472
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// mouse-based 3D tilt for glass cards
document.querySelectorAll(".glass-3d").forEach(card=>{
  card.addEventListener("mousemove",e=>{
    const r = card.getBoundingClientRect();
    const x = e.clientX - r.left;
    const y = e.clientY - r.top;
    const rx = -(y - r.height/2) / 20;
    const ry = (x - r.width/2) / 20;
    card.style.transform =
      `translateY(-8px) rotateX(${rx}deg) rotateY(${ry}deg)`;
  });
  card.addEventListener("mouseleave",()=>{
    card.style.transform="";
  });
});

// bubble click pop
document.querySelectorAll(".bubble").forEach(b=>{
  b.addEventListener("click",()=>{
    b.style.transform="scale(1.25)";
    setTimeout(()=>b.style.transform="",300);
  });
});