jQuery 를 이용한 간단한 Spoiler 효과

Easy FAQ 란 플러그인을 알게 된 후 한글 입력과 출력이 문제가 되어 소스를 보던 중 우연히 알게 되었다. 위의 문제는 소스의 문제가 아니라 테이블의 인코딩 셋이 달라 UTF8 값으로 다시 만들어 해결했다.

아무튼 참 방법이 간단했다. 적용은 댓글 입력 아래 스마일 입력에 했다.

jQuery(document).ready(function(){
           jQuery(".ds_answer").hide();
           jQuery("#tseCTIsmileys-comment").hide();
 
           jQuery("#tango_title").click(function(){
				jQuery("#tseCTIsmileys-comment").toggle("slow");
				return false;
			});
 
           jQuery(".ds_list .ds_ques").click(function(){
				jQuery(".ds_answer").toggle("slow");
				return false;
			});
		 });

효과를 더 보려면 zb4 페이지를 보면 된다. 이해가 빠르신 분들은 보면 바로 알 수 있다. id 값은 #으로 class 값은 . 으로 입력하면 그 곳을 알아서 숨겨주고 아래는 숨겨둔 곳을 보여주게 하는 함수다.

플러그인으로 만드려 했지만, 너무 단순해 스크립트만 해더에 추가한 후 사용하고 있다. 워드프레스는 jQuery를 기본으로 삽입한다. 효과를 쓰는 법을 더 알아 필요하면 다른 곳에도 적용해보면 재밌겠다. Rainbow

연관된 글이 없습니다.

Comments are closed.