jscript (15) 썸네일형 리스트형 [jQuery] 검색된 요소 크기 구하기. [ .width(), .height(), .outerWidth(), .outerHeight() ] DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 검색된 요소의 크기 구하기 #my { background-color:Yellow; border:2px solid gray; position:absolute; padding:10px z-index:0; margin:10px; top:50px; left:50px; width:150px; height:200px; } $(document).ready(function () { $("#btnSize").mouseover(function(){ // outerHeight() : 마진을 제외한 영역의 크기 v.. 제이쿼리로 css값 변경하기 제이쿼리로 css값 변경하기제이쿼리를 이용해서 css값도 변경이 가능 예를 들어 가로값이 100px인 div를 500px로 변경이 가능 $('SELECTOR').css(); css에서 글씨 색값을 지정하려면? selector{color:red} 그렇다면 제이쿼리 에서는? $('SELECTOR').css('color','red'); 위와 같이 표현해 줍니다. css('CSS속성','값'); 그럼 예제를 통하여 익혀 보도록 합시다. 상황 1 100px,200px,300px이라는 문구를 만들어서 클릭시 특정div가 100px,200px,300px로 가로값이 변하는것을 만들어 보죠^^ 우리는 이제 변수선언에 대해서도 공부했기 때문에 이제부터는 변수를 선언해서 공부를 해보도록 합시다. $(function(){ v.. jquery 닫기/열기 구현 닫기 누르면 내용이 사라지고 열기 누르면 다시 나타나게 jquery로 구현 닫기/열기 테스트 닫기 닫기/열기 내용 - 내용보기 클릭시 내용보여짐 내용 내용보기 [jQuery] 모바일로 접속했는지 PC로 접속했는지 구분 방법 PC 로 접속했을 때와 모바일 디바이스로 접속했을 때각각 다른 페이지를 보여주고 싶다면 다음과 같은 코드를 활용할 수 있다.메인 페이지(index.html) 에서 접속한 디바이스를 검사해서 각각의 페이지로 분기해준다. 사이트 메인 페이지(index.html)12345678910111213141516171819207번 라인모바일 디바이스 접속 여부는 대부분 request 헤더 정보에 포함된 user-agent 헤더를 읽어서 판단하는데, 모바일 기기는 워낙 방대하므로, 반대로 PC 접속 여부를 판단하는 것이 더 간단하다. 모바일용 페이지는 mobile 폴더 안에 작성한다. (mobile/index.html)12345678910111213141516171819202122232425262728293031모바일(.. jQuery 기초 01 jQuery 기초 01jQuery 설치와 간단한 css 컨트롤 하기 http://jquery.com/download/ 에서 개발자용 파일은 다운 받는다. 1.x 대와 2.x 대 두가지 버전이 있는데ie 6,7,8을 지원하기 원하면 1.X대를 선택하면된다. 머든지 높은게 좋으니 2.x대를 받고... html문서 head 태그안에 $(document).ready(function() {$('#jq).addClass('bgColor');$('#jq').click(function() { alert('안녕하세요');$(this).addClass("bgColor2");});});body 태그 안에 안녕하세요.JQ 안녕하세요.JQ 이거 타이핑도 힘들....... 마우스 오버시 나타나고 사라지는 테이블들 출처bad design|배드걸마우스 오버시 나타나고 사라지는 테이블들메인페이지에서 공지사항/FAQ 라는 탭을 누르면 그아래 해당되는 테이블이 나타나게 할때흔히 사용됨 news faq ../img/main_news_on.gif 마우스 오버시 나타나고 사라지는 테이블들 마우스 오버시 나타나고 사라지는 테이블들 메인페이지에서 공지사항/FAQ 라는 탭을 누르면 그아래 해당되는 테이블이 나타나게 할때 흔히 사용됨 news faq ../img/main_news_on.gif 이전 1 2 다음