jquery 질문드립니다. 채택완료
안녕하세요.
아래와 같이 문장 밑으로 똑같은 <g로 시작하는 문장이 200개 정도가 쭉 이어집니다.
<g id="run" clip-path="url(#__lottie_element_272)">
그럼 순서대로 0.5초 간격으로 block -> none이 계속이어집니다.
아래와 같은 로직이 되는지 알고 싶습니다.
감사합니다.
첫번째 0.5초
1. <g style="display: block;">
2. <g style="display: none;">
3. <g style="display: none;">
두번째 0.5초
1. <g style="display: none;">
2. <g style="display: block;">
3. <g style="display: none;">
세번째 0.5초
1. <g style="display: none;">
2. <g style="display: none;">
3. <g style="display: block;">
<g id="run" clip-path="url(#__lottie_element_272)">
<g style="display: block;" transform="matrix(1.5,51.375)" opacity="1">
<g opacity="1" transform="matrix(0.91706001750289916992)">
<path fill-opacity="1"></path>
</g>
</g>
<g style="display: none;" transform="matrix(1.5,51.375)" opacity="1">
<g opacity="1" transform="matrix(0.91706001750289916992)">
<path fill-opacity="1"></path>
</g>
</g>
<g style="display: none;" transform="matrix(1.5,51.375)" opacity="1">
<g opacity="1" transform="matrix(0.91706001750289916992)">
<path fill-opacity="1"></path>
</g>
</g>
답변 1개
시도해보세요.
</p>
<p><script></p>
<p> const gElements = document.querySelectorAll('g[id="run"]');</p>
<p> let currentIndex = 0;</p>
<p> </p>
<p> setInterval(() => {</p>
<p> gElements[currentIndex].style.display = 'none';</p>
<p> currentIndex = (currentIndex + 1) % gElements.length;</p>
<p> gElements[currentIndex].style.display = 'block';</p>
<p> }, 500);</p>
<p></script></p>
<p> </p>
<p>답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
응용해서 잘 처리 되었습니다.
감사합니다.