WEB_TECH 썸네일형 리스트형 자바스크립트 팝업창 띄우기 자바스크립트 팝업창 띄우기 심플소스입니다. 팝업창 띄우기 이렇게 해주고 같은 폴더에 popup.html파일이 있으면 팝업창이 뜹니다. 더보기 레이아웃 예제 모은 사이트 경로 http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html 이 사이트에서는 세련된 디자인의 깔끔한 CSS코드를 얻을 수 있습니다. http://www.pmob.co.uk/temp/3colfixedtest_4.htm 이 사이트에서는 다양한 레이아웃 예제를 좌측메뉴로 선택하여 확인할 수 있습니다. 더보기 마우스 오른쪽 버튼 금지 하는 방법 드래그금지, 오른쪽마우스 버튼 사용금지하는 방법을 알아볼까요. 퍼가기 못하도록 할 때 사용하면 유용하겠죠. body태그안에 다음의 속성을 적어 넣습니다. oncontextmenu="return false"는 마우스 오른쪽 클릭 금지와 키보드로 모두 선택(Ctrl+A)하는 것과 키보드로 소스보기를 금지시키는 속성입니다. onselectstart="return false"는 드래그를 못하게 하는 속성입니다.. 더보기 CSS 기본문법 CSS는 정말 많은 것을 할 수 있게 해 줍니다.CSS를 사용하여 많은 웹페이지들의 디자인을 한꺼번에 컨트롤 할 수 있습니다.문법을 살펴볼까요? CSS 기본 문법 CSS 표기는 크게 두 파트로 나눕니다.하나는 selector라는 이름이구요.다른 하나는 한개 이상의 Declaration들입니다.아래 그림을 보면 이해가 쉽습니다. selector는 우리가 스타일을 넣기 원하는 HTML엘리먼트 입니다.그리고 각각의 선언(declaration)은 속성(property)과 값(value)으로 구성되어 있습니다.속성은 우리가 바꾸기 원하는 스타일attribute입니다.속성은 값을 가지고 있습니다. CSS 예제 CSS 선언은 항상 세미콜론으로 끝납니다.하나의 선언 그룹은 { } 으로 싸여 있습니다. p {color:.. 더보기 DTD란 무엇인가? DTD라는 것은?문서타입 정의 입니다.DTD정의는 웹 표준에 따라 HTML문서를 만들때 페이지가 어떤 표준을 따를 것인지 미리 정하는 것입니다.그래서 이 DTD는 웹 브라우저가 웹페이지를 어떤 기준으로 파싱할 것인지 선언하는 역할을 합니다. DTD를 정의해야 하는 이유는1. 문서의 가독성 증가2. 브라우저 별 호환성 증가를 위해서(크로스 브라우징)3. 문서 제작의 효율성을 좋게 하기 위해서 DTD의 종류 1. HTML 4.01 Transitional(호환모드) 2. HTML 4.01 strict(엄격모드) 3. XHTML 1.0 Transitional(호환모드) 4. XHTML 1.0 strict(엄격모드) 아 그리고 중요한 것이 있군요.5. HTML 5 더보기 XHTML 작성법 XHTML은 HTML4.0과 비슷하지만 다른 점도 있습니다.XHTML은 HTML4의 구조적인 단점을 보완하기 위해 만들어진 규약입니다.즉 표준화 준수를 위해 만들어 졌고 문서자체적으로도 데이터의 구조를 갖도록 만들어 졌습니다.HTML이면서 XML인 것이지요. 작성법은 다음과 같습니다. 1. 대소문자를 반드시 구분합니다.모든 요소와 속성값은 반드시 소문자로 작성해야 합니다. : X : O 2. XHTML열고 닫음이 명확해야 합니다. 구문 3. 속성 값에 따옴표 꼭 붙여줘야 합니다. 4. WellFormed하게 종료의 표현을 명확하게 해 줘야 합니다. , , 더보기 Geolocation API Geolocation API는 디바이스의 위치정보를 얻는 javascriptAPI입니다.GPS로 부터 얻은 것인지 네트워크로부터 얻은 것인지는 구분하지 않습니다. Window.navigator 객체로부터 정보를 얻습니다. 크롬에서 아래의 경로로 가보면http://www.browsergeolocation.com/자신의 현재위치가 나옵니다. PC로 볼 때 안나올 수도 있습니다. 위치정보 객체의 속성위치정보 객체의 속성들을 알아보겠습니다. coords 여러개의 속성들이 있다timestamp Geolocation 지원 브라우저http://www.caniuse.com여기서 geolocation이라고 쳐 보면 지원하는지 확인할 수 있습니다.역시 HTMl5를 지원하지 않는 브라우저에서는 지원이 안 되는 것을 확인할 .. 더보기 Google Maps Javascript API V3 Google Maps Javascript API V3 는 그 유명한 구글지도 세번째 번입니다. https://developers.google.com/maps/documentation/javascript/tutorial 위 경로의 Hello, World 예제를 살펴보도록 하겠습니다.이 예제는 HTML에 캔버스로 지도가 나올 영역을 정의하고 위도 경도를 입력하고 옵션값을 객체로 정의해서 캔버스에 지도를 그리는 형식으로 되어 있습니다. 주의 할 점1. 선언을 사용하여 HTML5로 선언2. script 태그를 사용하여 Maps API 자바스크립트를 포함3. 지도를 넣을 'map_canvas'라는 div 요소를 생성4. 다양한 지도 속성을 담고 있는 자바스크립트 객체 리터럴을 만듬5. 'map' 객체를 만들기 위.. 더보기 iframe 태그에 대해 알아봅시다. iframe 태그는 정말 유용합니다.ie4에서 먼저 사용하기 시작했는데 다른 웹경로에 있는 페이지를 내 웹페이지 안에 불러올때 사용합니다.어플리케이션에서 마치 webView와 같은 역할을 합니다. 보안을 중요시하는 네이버블로그 같은 곳에서는 사용할 수 없으니 잘 취사선택해서 사용하면 좋을 것입니다. 속성src = "주소" : 불러올 페이지 경로name = "이름" : 이름을 지정하는 속성width = "200" : 가로height = "300" : 세로frameborder = 0 : 테두리 두께marginwidth = 0 : 좌우 여백marginheight = 0 : 상하 여백scrolling = auto : 스크롤바 생성하는 속성 auto / no / yes alien = center : 정렬 left.. 더보기 날짜 시간 관련 객체 Date 관련 메서드} date() 오늘날짜 } getFullYear() 올해 } getTime() 01.01.1970년 이래로 밀리세컨드 } setFullYear() 년월일을 강제로 입력 } toUTCString() Fri, 17 Aug 2012 12:21:14 GMT } getDay() 요일 1. 날짜 출력먼저 날짜를 찍어 볼까요? 실행하면Wed Oct 24 17:37:57 UTC+0900 2012 이처럼 표시됩니다. 2. 요일 표시하기이번에는 요일을 표시해 보도록 하겠습니다.getDay()메서드를 이용하여 요일을 뽑아낼 수 있습니다. Click the button to display todays day of the week.Try it 이렇게 하고 실행한 후 버튼을 클릭하면 Wednesday라고 해.. 더보기 이전 1 ··· 3 4 5 6 7 8 9 다음
