본문 바로가기

WEB/JavaScript

(19)
Js - bootstrap semiProjects : 이용 약관 동의 Lorem ipsum 로그인 회원가입 프로젝트 소개 회원가입 게시판 자료실 갤러리 관리자 회원가입 이용약관 본인확인 정보입력 가입완료 사이트 이용약관 회원가입을 위해서 아래 사이트 이용약관, 개인정보 확인 사이트 이용약관 제 1 장 환영합니다! 제 1 조 (목적) All rights reserved. 이용약관에 동의합니다. 개인정보 수집 및 이용에 대한 안내 1. 개인정보처리방침이란? 공고일자: 2021년 11월 30일 시행일자: 2021년 12월 07일 개인정보 수집 및 이용에 동의합니다. 모두 동의합니다 모두 동의하지 않습니다 Copylight © Lorem Ipsum 2022. All rights reserved. powerd bt Bootstrap5 로그인 닫기 아이디 비밀번호 로그인 상태유지 로..
Js - 톰캣 이용한 AJAX AJAX로 구현하는 시/구/동 선택하기 1. tomcat.apache.org에서 tomcat 서버를 다운로드하고 적당한 곳에서 압축해제해 둠 2. webapps/ROOT에 sido.jsp, gugun.jsp, dong.jsp에 복사해 둠 (23zipcode.html도 마찬가지!) 3. bin/startup.bat로 서버 시작해 둠 4. http://127.0.0.1:8080/sido.jsp로 실행 확인 5. 실습확인은 http://127.0.0.1:8080/23zipcode.html을 이용함 6. 선택한 시도에 대한 구군 조회는 'gugun.jsp?sido=시/도이름' 로 함 7. 선택한 시도와 구군에 대한 동 조회는 'dong.jsp?sido=시/도이름&gugun=구/군이름' 으로 함
Js - 이미지 슬라이드 자바스크립트 이미지슬라이드 마치 유원지의 회전목마처럼 여러 이미지들을 일정간격으로 번갈아 가며 보여주는 기능을 의미 자바스크립트 이미지슬라이드 마치 유원지의 회전목마처럼 여러 이미지들을 일정간격으로 번갈아 보여주는 기능
Js - dropdown menu 자바스크립트 드롭다운메뉴 메뉴에 마우스포인트를 올렸을 때 숨겨진 메뉴가 나오는 메뉴 Home News dropdown naver google daum
Js - modal 자바스크립트로 모달창 만들기 뒷배경은 투명한 검정색 표현 검은 배경위로 모달창 표시 모달창 띄우기 모달창 닫기
Js - 브라우저 객체 2 자바스크립트 BOM location 현재 브라우저에 표시된 문서의 url을 변경하거나 url에 대한 정보를 얻을 수 있음 구글로 이동 네이버로 이동 오늘의 추천사이트 navigator 클라이언트의 브라우저 및 운영체제 정보를 알아냄
Js - 브라우저 객체 자바스크립트 브라우저 객체 개요 웹브라우저의 여러 구성요소들을 객체형태로 구현해서 자바스크립트로 제어할 수 있도록 만들어 놓은 것 BOM은 W3C의 표준모델은 아님. 따라서, 브라우저 제조사마다 구현방식이 달라 특정 부분은 서로 호환되지 않는 것도 존재 window객체 웹브라우저의 창 자체를 의미하는 객체 innerHeight, innerWidth : 브라우저의 뷰포트 크기를 의미 rs 문서열기/닫기 window객체의 open 함수를 이용해서 지정한 문서를 새창이나 새로운탭에 띄울수 있음 또한, window객체의 close함수를 이용하면 띄워진 창이나 탭을 닫을수있음 창 생성시 창에 관한 속성(크기,너비등)을 설정하면 탭으로 생성되지 않고 독립적인 창으로 생성됨 주 브라우저의 url과 새창의 url이 동..
Js - 이벤트 핸들러 자바스크립트 이벤트 개요 이벤트는 사용자가 웹페이지를 이용하면서 발생시키는 어떤 행위를 의미 버튼을 클릭하거나 브라우저 크기를 변경하거나 html 문서가 브라우져에 의해 로드되었거나 특정 키를 눌렀거나 하는 것을 의미 이벤트가 발생하면 누군가는 이를 감지할 수 있어야 하고 그에 대응하는 처리를 호출해 주어야 함 브라우저는 이러한 이벤트를 감지해서 통지를 해줌으로써 사용자와의 상호작용을 가능하게 함 이벤트 핸들러 이벤트가 발생하면 그에 맞은 반응을 해야 함 이러한 반응은 보통 함수로 구현되어 있고, 이벤트 발생시 함수가 실행됨 - 이벤트 핸들러 이벤트 핸들러 등록 인라인 이벤트 핸들러 : 요소에 직접 이벤트핸들러를 등록 (비추), 인라인 이벤트 핸들러 프로퍼티 : ..