우리가 사는 세상을 모두 알기엔 인생은 너무 짧다.!!

사이트관리/그누보드 소스

블링크 텍스트 깜박이는 문자 예제 소스

거북선인 2019. 2. 27. 10:48
반응형


# 블링크 텍스트 깜박이는 문자 예제 소스아래는 계속해서 깜박이는 예제를 만들어보려 합니다. 먼저 이 코드를 실행하면 어래처럼 매우 반짝이는 효과를 가진 텍스트가 보이게됨니다.

TEST : 

그렇다면 소스코드는 어떻게될까요? 아래는 제이쿼리를 사용하여 구현한 소스 코드입니다.
@ blink.html

<span>TEST : </span>
<span class="blinkEle">Blink Text</span>


아래는 제이쿼리 소스코드입니다.
@ blink.js

setInterval(function(){
  $(".blinkEle").toggle();
}, 250);


이제 깜박이는 텍스트 구현이 완성되었습니다. 여기에 사용된 toggle() 메소드는 특정 요소에 사용할 경우 해당 엘리먼트를 숨기고 보여주는 것을 반복합니다.

위 코드의 장점은 제이쿼리 선택자로 모든 클래스에 사용하였기 때문에 모든 요소를 찾아 적용시킨다는 것입니다. 깜박여야 할 요소가 많아도 모두 잘 동작합니다.

반응형