전체보기 썸네일형 리스트형 Query Basic 9강 - animate(1) 소스를 보시죠. Click it Click it Click it Click it $().animate()를 사용해줍니다.첫 번째 파라메터로는 변경될 내용을 적어주시고두 번째 파라메터로는 속도를 적어주시면 됩니다.속도는 "fast", "slow" 가 있고, 숫자를 입력해주셔도 됩니다. animate()를 사용할실때에는 CSS에 position 이 Relative 또는 Absolute가 있어야 합니다. 결과. 더보기 Query Basic 8강 - Toggle() Toggle() 을 사용해보도록 하겠습니다.참고로 toggle() 객체는 jQuery 1.9 버전에서 정상동작을 하지 않더군요.. 소스를 보시죠. 위 구성에서 시작하겠습니다. 우선 부분에 내용을 넣어줍니다. 그 다음 태그를 클릭 이벤트를 만들어줍니다. 마지막으로 태그로 효과를 넣어줍니다. 결과를 확인해보겠습니다. 클릭 시 위와 같이 주황색으로 바끼고 또 다시 클릭시 검은색으로 바낍니다. 더보기 JQuery Basic 7강 - show() & hide() 이번에는 Click 시 show/hide 가되는 동작을 구현해 보도록하겠습니다. 먼저 소스를 보시죠. Allips RintIanTta Silverlight Windows Phone Web Development 기존 소스에 하나씩 추가해보겠습니다. 먼저 버튼을 하나 만들겠습니다. 그리고 버튼 클릭 시에 대한 이벤트를 만들어주겠습니다. 결과. 더보기 jQuery Basic 6강 - Event 지난 시간에 addClass()와 removeClass()를 배웠으니, 이제는 Event를 구성하겠습니다. 먼저 소스를 보시죠. 태그안에 내용을 넣었습니다. 그리고 먼저 태그에 Hover()를 사용하였습니다. hover() 안에 두가지 함수를 넣어주시면, In hover, out hover로 나뉜닙니다.그리고 나서 두가지 함수를 추가한다음 color 옵션을 넣었습니다. 확인해보겠습니다. 지난번에 사용한 addClass와 removeClass()와 연관되어 사용됩니다. Allips RintIanTta Silverlight Windows Phone Web Development 결과. addClass()나 removeClass() 외에도 toggleClass()라는 것도 있으니 사용해보시기 바랍니다. 더보기 jQuery Basic 5강 - addClass() & removeClass() age.html 먼저 소스를 보겠습니다. 그리고 태그안에 내용을 넣어주세요. 그 다음 위와 같이 태그를 주겠습니다. 그리고 오늘의 주제인 addClass()를 봅시다.원래 위 태그 내를 보시면 class 속성을 하나도 주지 않았기 때문에 스타일이 먹히지 않습니다. 그래서 저희가 jQuery를 사용해 태그에 클래스를 지정해주겠습니다. 자 이제 결과를 확인해 보겠습니다. addClass() 를 사용해 보았습니다. 이번에는 removeClass()를 사용해보겠습니다.addClass()로 지정한 것을 removeClass()로 제거하는 것 입니다. 결과. addClass()와 removeClass()를 사용해보았습니다. 더보기 jQuery Basic 4강 - 변수 & 연속사용 을 다음과 같이 변수에도 넣어줄 수 있습니다. 변수에 넣어주면 다음과 같이 두개의 옵션을 적용할 수 있습니다.참고로 그냥 .css({color:"Red", background-color:"Orange"}) 이런식으로도 사용할 수 있습니다. 결과. 참고로 이렇게 사용할 수도 있답니다. 더보기 jQuery Basic 3강 - Selector 이번에는 jQuery에서 CSS 를 해보도록 하겠습니다. [HTMLPage.html]에 아래와 같이 추가합니다. 그 다음 태그에 CSS를 줘보겠습니다. 결과를 확인하면.. 위와 같은 결과가 나옵니다. 자, 이제 style 태그를 지우고 jQuery를 사용해보도록 하겠습니다. 태그에 color을 Red로 하겠다. 이네요.결과를 확인해 보면 위 css로 적용한 결과와 동일할 것 입니다. 이번에는 여러개의 태그에 적용해보겠습니다. 여러개의 태그에 각 옵션을 주기위해서 id 와 class를 사용하였습니다. 확인. 더보기 jQuery Basic 2강 - jQuery & $ 먼저 jQuery와 $의 관계에 대해 설명해드리겠습니다. 먼저 아래 소스를 보시죠. [HTMLpage.html] $ 란 jQuery의 약자입니다.동일한 형태로 사용이 되는 관계로 원래 사용했던 jQuery 라는 글자를 $로 바꿔주시면 된답니다. 그리고 $(document).ready()란 jQuery에 쓸만한 document가 준비 끝나면 이 함수를 실행시켜라 라는 뜻 입니다. 자. 다시한번 확인해 보겠습니다. [HTMLpage.html] 확인. 똑같은 결과가 나오는걸로 $ = jQuery 와 같은 공식을 인증하였습니다. 더보기 jQuery Basic 1강 - 기본설정 우선 jQuery 사이트로 갑니다.http://jquery.com/ Download jQuery 를 클릭합니다. Download the ompressed, production jQuery 1.9.1 을 클릭합니다. http://code.jquery.com/jquery-1.9.1.js 위 주소를 복사합니다. 이클립스를 여시고.. 위와 같이 HTMLpage.html 을 생성합니다. [HTMLpage.html] 더보기 jQuery 브라우저 호환성이 있는 HTML 속 자바스크립트 라이브러리이며 클라이언트 사이드 스크립트 언어를 단순화 할 수 있도록 설계되었다. 존 레식이 2006년 뉴욕 시 바캠프(Barcamp NYC)에서 공식적으로 소개하였다. jQuery는 오늘날 가장 인기있는 자바스크립트 라이브러리 중 하나다.jQuery는 MIT 라이선스와 GNU 일반 공중 사용 허가서v2의 듀얼 라이선스를 가진 자유 오픈 소프트웨어이다. jQuery의 문법은 코드 보기, 문서 객체 모델 찾기, 애니메이션 만들기, 이벤트 제어, Ajax 개발을 쉽게 할 수 있도록 디자인 되었다. 또한, jQuery는 개발자가 플러그인을 개발할 수 있는 기능을 제공한다.마이크로소프트와 노키아는 자사 플랫폼에 jQuery를 포함하는 계획을 발표한 바 있다. 마이.. 더보기 이전 1 ··· 15 16 17 18 19 다음
