시각적 효과를 위한 effect 메소드
요소에 애니메이션 효과를 만들기 위한 메소드 집합

1. $('요소명').메소드명();
2. $('요소명').메소드명([speed]);
3. $('요소명').메소드명([speed], [easing], [callback]);

    speed : 실행속도(밀리세컨초) / 숫자 or slow, fast
    easing : 변경되는 지점별 속도 / linear, swing 기능
    callback : 메소드 실행 후 실행함 함수
    

---

show() / hide() 메소드

Show() : 요소를 점점 커지게 하면서 화면에 나타나거나
hide() : 요소를 점점 작게 하면서 화면에 숨기는 메서드

$("#show-btn").on("click", function() {
	$("#img1").show(500); // 1000ms == 1s
});

---

fadeIn() / fadeOut() 메소드

fadeIn() : 점점 불투명 해지면서 나타남
fadeOut() : 점점 투명 해지면서 사라짐

$("#fadeOut-btn").on("click", function() {
	$("#img2").fadeOut(500);
});

---

slide 메소드

slideDown()과 slideUp()
$(selector).slideUp([speed, easing, callback])

$(function() {
            $("div").on("click", function() {
                if($(this).next("p").css("display") == 'none') {

                    $(this).siblings("p.contents").slideUp();
                    // 다음 요소는 내려라
                    $(this).next().slideDown();

                } else {
                    $(this).next().slideUp();
                }
            });
        });