[js/jQuery] simple FAQ style code.
간단하게 구현해본 FAQ 형식의 코드입니다. 실무에서 일하시면서 매우 자주 접하는 형식 중 하나일 것이라 생각되어 만들어봤습니다. 🙂 html markup
1 2 3 4 5 6 7 8 9 10 |
<dl id="faq1"> <dt>question1</dt> <dd>answer1</dd> <dt>question2</dt> <dd>answer2</dd> <dt>question3</dt> <dd>answer3</dd> <dt>question4</dt> <dd>answer4</dd> </dl> |
javascript
1 2 3 4 5 6 7 8 9 10 |
$.fn.setFaq = function() { return this.each(function(i, elm) { $elm = $(elm); $elm.find("dd").hide() .end().delegate("dt", "click", function() { $(this).next().slideToggle(200) .end().toggleClass("on"); }); }); }; |
Here is the TEST CODE http://jsfiddle.net/rootbox/uD89q/ 즐거운 코딩되세요~ 🙂