FAQ

h1. FVS 이미지 빙글빙글 돌리기 스크립트

<pre>

"use document";

setTimeout(() => {

    const logo = document.querySelector('[data-name^="투명로고"]');

logo.style.position = "absolute";  // 이미지를 페이지 내에서 절대 위치로 설정

logo.style.transformOrigin = "center";  // 회전 기준을 중앙으로 설정

logo.style.top = "50%";  // 상단 위치 설정 (중앙 맞추기)

logo.style.left = "50%";  // 좌측 위치 설정 (중앙 맞추기)

logo.style.transform = "translate(-50%, -50%)";

    const images = document.querySelectorAll('[data-name^="이미지"]');

    // 각 이미지에 대해 회전 애니메이션 적용

    images.forEach((image) => {

        let rotation = 0; // 초기 회전 각도

        // 스타일 설정: 이미지가 제자리에서 회전하도록 하기 위해 스타일을 설정합니다.

image.style.position = "absolute";  // 이미지를 페이지 내에서 절대 위치로 설정

image.style.transformOrigin = "center";  // 회전 기준을 중앙으로 설정

image.style.top = "50%";  // 상단 위치 설정 (중앙 맞추기)

image.style.left = "50%";  // 좌측 위치 설정 (중앙 맞추기)

image.style.transform = "translate(-50%, -50%)";      // 정확한 중앙 위치를 맞추기 위한 트랜스폼

        // 애니메이션을 계속 반복하도록 하는 함수

        function animate() {

            rotation += 0.5; // 매 프레임마다 0.5도씩 회전

image.style.transform = `translate(-50%, -50%) rotate(${rotation}deg)`; // 회전 적용

            // 브라우저가 다음 프레임을 준비하도록 함

            requestAnimationFrame(animate);

        }

        // 애니메이션 시작

        animate();

    });

}, 500);

</pre>