Web/javaScript
![](http://i1.daumcdn.net/thumb/C400x400/?fname=https://blog.kakaocdn.net/dn/deUZDb/btrnvAy16Gf/lv0LC5rSYxB18VG2MVxvfK/img.png)
![](https://tistory1.daumcdn.net/tistory/4410912/skin/images/no-image.jpg)
가장 간단한 탭 만들기를 해보겠습니다. 메뉴1 메뉴2 메뉴3 tab1입니다. tab2입니다. tab3입니다. [html] 1. 형식으로 탭 매뉴를 만들어줍니다 2. 형식으로 탭 content를 만들어줍니다. 3. 첫번째 탭의 class에 current를 넣어줍니다. [css] 1. 모든 탭 메뉴와 contents를 display: none으로 설정해줍니다. 2. class에 current가 붙혀있는 것은 display: inherit로 표출합니다. [javascript] 1. 탭을 클릭하면 해당 탭의 data-tab을 가져옵니다. 2. 모든 탭 메뉴와 contents에 current class를 없애줍니다. -> removeClass 3. 클릭한 탭($.(this))의 클래스에 addClass를 이용해 ..
![](http://i1.daumcdn.net/thumb/C400x400/?fname=https://blog.kakaocdn.net/dn/r9b5a/btq1yEIn93S/BEwjd0aTgicXnD74Jh2K21/img.jpg)
![](https://tistory1.daumcdn.net/tistory/4410912/skin/images/no-image.jpg)
1. 개념 및 차이 동기( Synchronous) - 동시에 일어나는 것 - 요청과 결과가 한 자리에서 동시에 일어남 - 결과가 주어질 때까지 아무것도 못하고 대기 → 결과를 받아야 다음 동작 - 설계가 간단 - 효율 저하 비동기(Asynchronous) - 동시에 일어나지 않는 것 - 요청한 그 자리에서 결과가 주어지지 않음 - 결과가 주어지는데 시간이 걸려도 그 시간 동안 다른 작업 가능 - 자원을 효율적으로 쓸 수 있음. - 할 일이 끝난 후 처리결과를 알려주는 콜백 함수를 알려줌 - ajax에서는 success, error, complete 을 콜백함수라고 할 수있음 - DOS와 같은 단일 운영체제에서는 사용 불가, windows 같은 multitask 환경에서만 가능 예를 들어, 음식점에서 음식..
![](http://i1.daumcdn.net/thumb/C400x400/?fname=https://blog.kakaocdn.net/dn/DVi4N/btqUOCR4God/xKbrPUHGhuHGkMOJGae0D0/img.png)
![](https://tistory1.daumcdn.net/tistory/4410912/skin/images/no-image.jpg)
1. View [팝업열기버튼] [일반 레이어팝업] [모달레이어 팝업] 2. Implementation contents 1) [html] CATEGORIES 는 제목, [css] float: center으로 가운데 정렬 2) [html] 각 메뉴들 는 내용, [css] margin을 이용하여 위아래 간격을 줌 3) '뽀블로그 클릭'을 누르면 새 창에서 블로그로 이동 - 이용 _black를 쓰면 새 창에서 열림 4) 닫기창 누르면 레이어창이 보이지 않음 - [html] 이미지를 이용해 닫기버튼 삽입 - [css] cursor: pointer; 로 닫기 창에 마우스를 가져가면 화면에 그려지는 마우스포인터가 아래 사진으로 바뀜 - [js/jquery] $("#close_button").click(fun..