webservice_basics

slideDown $(selector).slideDown(speed,callback); slideUp slideToggle 예제) Click to slide the panel down or up Hello world!

fadeIn: 안 보이던 element 화면에 서서히 나타낼 때 사용한다 speed: 그냥 비워둬도 되고, "slow" 처럼 속성을 적어도 되고, 아니면 milliseconds로 표기해도 된다. $(selector).fadeIn(speed,callback); 예제) Demonstrate fadeIn() with different parameters. Click to fade in boxes fadeOut fadeToggle: 한번 클릭하면 fadeIn, 한번 더 하면 fadeOut 작업을 실행한다 fadeTo: 특정 투명도를 향해 fading 된다, opacity 속성이 추가되어 있다 $(selector).fadeTo(speed,opacity,callback);

jQuery DOM events HTML DOM과 달리 mouseover와 mouseout 대신 mouseenter, mouseleave가 있다는 것을 알아두자. 이름이 조금씩 다른것도 있으니 유의해서 사용하도록 하자. Event 사용하는 법 $(document).ready(function(){ }); 와 함께 많이 쓰인다. $("p").click(function(){ // action goes here!! }); 새로운 이벤트: dblclick mouseenter mouseleave mousedown mouseup focus & blur Name: Email: on: 여러 이벤트를 걸고 싶을 때 사용한다 $("p").on("click", function(){ $(this).hide(); }); 또는 C..

jQuery 는 자바스크립트 라이브러리이다. 이전에 자바스크립트를 통해서 하던 작업들을 훨씬 더 짧은 코드로, 간편하게 만들 수 있다는 장점을 가지고 있다. jQuery를 이용해서 다음과 같은 작업들을 할 수 있지만 BOM(Browser Object Model)과 관련된 작업은 여전히 자바스크립트로 처리해야 한다. HTML/DOM manipulation CSS manipulation HTML event methods Effects and animations AJAX Utilities jQuery를 사용하기 jQuery는 앞서 말했듯이 JS의 라이브러리이기 때문에 반드시 jQuery 라이브러리 추가하는작업을 해줘야 한다. jQuery에도 많은 버전이 있으니 사용하기에 앞서 버전을 잘 확인하도록 하자! jQ..

hide() 와 show() 자바스크립트와 css를 이용해서 숨기기 기능을 넣으려면 이벤트부터 , css property를 display: none/block;로 설정하는 번거로운 작업을 해야 했을텐데, jQuery를 사용하게 되면 이 작업을 보다 간단하게 할 수 있다. $("#hide").click(function(){ $("p").hide(); }); $("#show").click(function(){ $("p").show(); }); Callback 함수 이용하기 Callback method를 사용하면 앞에 제시된 시간이 흐른 뒤에 함수가 실행된다. 이벤트가 종료되었을 시점에 어떤 작업을 수행하라고 명령하고 싶을 때 사용하면 된다. 예시) hide(2000, function(){ }); $(sele..