클로리셔 작은 공간

Inputbox Validtion Numbers Only 자바스크립트 방법 중 가장 많이 쓰이는 방법 중 하나가 input 텍스트 박스 내에 숫자만 입력하게 하는 방법이다. 다양한 개발 방법 중 자바스크립트 이용하는 방법과 정규식의 인라인으로 작성하는 방법을 알아보자. 1. 정규식 이용한 방법 이렇게 onKeyup 속성을 넣어서 정규식을 입력하면 숫자외에 입력이 되지않는다. 2. 자바스크립트 이용한 방법 function inNumber(){ if(event.keyCode57){ event.returnValue=false; } } 자바스크립트로 키보드 누르는 키를 제어함으로써 숫자만 입력가능하도록 할 수 있다.

1. 라디오 버튼 (Radio Button) 라디오 버튼 특징은 여러 라디오 버튼 중 하나만 선택 가능하다. 인라인 태그에 있는 'checked'는 라디오 박스에 기본값으로 체크 된 상태에서 로딩하라는 표시이다. 라디오 버튼는 여러개 중 하나만 선택되어야 하는데 name 값이 같지 않거나 없다면 제 기능을 발휘하지 못한다. 만약 라디오 버튼 속성에 name 없으면 모두 체크하거나 해제할 수 있는데 그것은 라디오 버튼라고 할 수 없다. 남성 여성 그럼 여기서 체크 값을 가져오는 스크립트를 알아보자. 매우 그렇다. 그렇다. 보통이다. 일단 체크 값들에게 값(value)을 부여한다.그리고 라디오버튼의 name 고통적인것을 이용해서 스크립트를 짠다. $("input[name='radio_answer']").ea..

:: 제목태그 - 종류와 개념 태그는 문서의 제목을 표시할 때 사용하는 태그로 'heading'의 의미를 가진다. 제목의 크기별로 부터 까지 사용이 가능하다. 이 가장 상위 계층의 제목을 표시할 때 사용되며 이 가장 작은 소제목을 표시할 때 사용한다. 즉, 태그의 숫자가 커질수록 제목 글자의 사이즈는 작아진다. 제목1의 크기입니다! 제목2의 크기입니다! 제목3의 크기입니다! 제목4의 크기입니다! 제목5의 크기입니다! 제목6의 크기입니다! 제목의 표현이라는 기능 외에도 다른 중요한 역할을 하는데 여러 검색엔진은 각 웹사이트의 내용을 바로 이 태그를 이용하여 키워드를 수집하고 내용을 파악한다. 그래서 HTML 문서에 포함되는 제목은 태그로 작성해야만 검색엔진에 의해 제대로 검색 될 확률을 높일 수 있다. *..

1. ID 선택자 #아이디 { 속성1: 속성값; 속상2: 속성값; } id는 한페이지에 단 한번의 정의로 고유한 하나의 태그만 사용할 수 있다. 그리고 하나의 태그에 id 속성은 하나만 가질 수 있다. 동일한 것이 없는 고유한 태그기 때문에 라고도 표현할 수 있다. 로고, 상단메뉴, 하단정보 같은 스타일을 정의할 때 id를 사용한다. 2. CLASS .클래스명 { 속성1: 속성값; 속상2: 속성값; } class는 한페이지에 반복적으로 사용되는 스타일을 정의할 수 있다. 또한 하나의 태그에 class 속성은 여러개 가질 수 있다. 똑같은 형태로 꾸밀건데 하나씩 만든다면 엄청 불편하겠죠? 그럴때 그룹처럼 묶어서 똑같은 스타일을 지정해주고 뿌려준다면 아주 편할것이다. 3. 스타일 선언의 우선순위 !impor..

Skip Menu / Skip Nav를 왜 사용하는가? - 사용자 편의 및 웹 접근성을 위해서다. 웹접근성이라하면 마우스가 고장났다던가, 키보드를 사용 못하는 경우 등 정상적으로 쓸 수 없는 상황에 대해서 편의를 고려해서 제작하는 방법이다. 엄청난 컨텐츠 영역을 가지고 있는 홈페이지에서 원하는 영역에 도달하고 싶을때 Tab 키를 수 없이 눌러야 할것이다. 그런 불필요한 액션을 없애기 위해 스킵메뉴(Skip menu)를 제작한다. 스킵 메뉴를 만들면 해당 영역으로 즉시 갈 수 있는 라고 생각하면 된다. 웹접근성 맞게 스킵메뉴 만들어보기 - 스킵네비게이션은 다음으로 나오는 것이 가장 적절합니다. 본문 바로가기 #skipNav{position:relative;z-index:9999;} #skipNav a{po..

1. 변수 변수란 언제든 바뀔 수 있는 이름을 붙이는 것이다. 변수를 선언할때는 let / var 를 앞에 붙인다. 변수 선언할 때는 꼭 초깃값을 지정해야하는 것은 아니다. 초깃값을 할당하지 않았을때는 특별한 값 undefined가 할당된다. let 문 하나에는 변수 여러개를 선언 할 수 있다. let targetTempC, room1 = "conference_room", room2 = "lobby"; 여기서는 변수 3개를 선언 했는데 targetTempC는 값을 할당하지 않았으므로 undefined 받습니다. room1은 선언과 동시에 'conference_room'를 할당 받았고, room2 역시 선언과 동시에 'lobby'를 할당했습니다. 2. 상수 ES6에서 새로 생겼습니다. 상수는 변수처럼 값을..

함수 - 하나의 단위로 실행되는 문의 집합. -반환값 : 함수 호출의 값을 반환(return)값이라고 한다. 함수 바디안에서 return 키워드 사용하면 함수를 즉시 종료하고 값을 반환한다. -호출과 참조 : 함수 식별자 뒤에 괄호()를 쓰면 함수를 호출하려고 하는것이고 함수 바디를 실행시킨다. 그리고 호출한 표현식은 반환값이 된다. 괄호를 쓰지 않는다면 다른 값과 마찬가지로 함수를 참조하는 것이며 그 함수는 실행되지않는다. getGreeting();//"Hello World!" getGreeting; // function getGreeting() -함수와 매개변수 : 함수 호출하면서 정보를 전달할 때는 함수 매개변수를 이용한다. function avg(a,b){// a와 b는 정해진 매개변수 retur..

1. HTML 마크업 메뉴01 메뉴02 메뉴03 내용01 내용02 내용03 우선 HTML 코드로 탭 메뉴 리스트들과 그 메뉴를 선택했을 때 나타나는 탭 컨텐츠를 제작합니다. * 탭 메뉴 리스트 : ul.tabs > li.tab-list * 탭 컨텐츠 영역 : div.tab-content 2. Javascript $(document).ready(function(){ $('ul.tabs li').click(function(){ var tab_id = $(this).attr('data-tab'); $('ul.tabs li').removeClass('current'); $('.tab-content').removeClass('current'); $(this).addClass('current'); $("#"+tab..

매개변수란 = 두 변수를 연결해주는 변수 '매개'라는 단어를 사전에서 찾아보면 '둘 사이에서 양편의 관계를 맺어 줌'이라는 뜻을 가지고 있다. 그렇다면 매개 변수는 어떻게 사용되는 것일까? RPG게임을 할때 아이템을 조합하던 그 순간을 떠올려 보자. A라는 아이템과 1~3까지의 카드를 가지고 있고, 아이템과 한가지의 카드를 합치면 새로운 아이템이 탄생하는걸 가정해보자. (1) A + 1카드 = X (2) A + 2카드 = Y (3) A + 3카드 = Z 아이템 A가 있는데 여기에 카드 1을 합치면 아이템 X가 탄생하고, 2를 합치면 Y, 3을 합치면 Z가 탄생하게 된다. 1, 2, 3 중에서 어떤 아이템을 섞느냐에 따라 결과물도 다르게 나온다는 뜻이다. 아이템 A는 항상 고정이고, 최종 아이템 결과물은 ..