코딩짜는 일상

메뉴의 서브메뉴를 숨겼다 펼치거나 특정 목차의 컨텐츠 내용을 접었다 펼칠 때 주로 collapse 또는 아코디언을 검색합니다. 찾아보시면 여러가지 방법을 소개하고 있지만 일단 이 글에선 Javascript와 jQuery를 쓰는 방식을 비교해보고자 합니다. 먼저 HTML은 다음과 같습니다. HTML main 1 sub 1 sub 2 sub 3 Javascript 먼저 자바스크립트 입니다. 서브 메뉴의 max-height를 0으로 만들거나 원래 높이로 되돌리는 방식으로 접었다 폈다 하는 컨셉입니다. sub 클래스 스타일에 transition을 추가해주지 않으면 애니메이션 없이 팟 나타났다가 팟 사라집니다. 주의!! jQuery 마지막으로 제이쿼리 입니다. 자바스크립트보다 코드가 훨씬 짧아졌습니다! 서브 메뉴..

(업데이트) html, body 둘다 overflow를 먹인채로 scrollTo를 써야하는 경우가 있어서... 좀 더 고심끝에 새로운 방법을 찾았습니다! - 20220802 #1 원인 스크립트가 동작하지 않는다면 가장 먼저 생각해볼 것은 함수 function 이 제대로 동작하지 않는 것입니다. 함수 안에 console.log('확인문구')를 입력해서 console에 문구가 찍히는지 확인해보면 알 수 있죠. 하지만 문구가 찍히는데도 scrollTo가 안 먹힌다? 1. 이동해야 할 위치값을 못 받음 2. scrollTo로 움직일 스크롤을 잘못 특정함 원인은 이 둘 중에 하나일 것입니다. #2 구조 저는 요소를 클릭하면 javascript를 이용해 지정한 페이지로 이동하는 웹 페이지를 만들었습니다. 2번으로 ..

업무의 일환으로 설문조사 웹 페이지를 만들게 되었습니다. 처음에는 간단해서 반나절이면 끝날 줄 알았는데 역시나 생각할 거리가 많았고 2일정도 걸렸습니다. 문항처럼 반복 작성하는 노가다가 있었지만 VS코드의 단축키 기능 도움을 많이 받았습니다. (특히 ctrl+alt+방향키 , alt+클릭...) 기능 구상 기능은 크게 3가지가 있습니다. 1. 각 설문 문항 (checkbox, radio) 2. 미응답 여부 확인 3. 설문 저장 특히 미응답 여부를 확인할 때 1) 단순히 선택값의 유무를 판단하는 경우 2) 기타(직접입력)을 선택한 경우 3) n개 이상, m개 이하 복수선택인 경우(checkbox) 이렇게 3가지 경우를 추가로 고려해야 하죠. 우선은 각 설문 문항부터 작성하고 이후 JS로 미응답 여부를 판단..

현재 우리 회사는 웹으로 작업한 페이지를 앱을 통해 보여줌으로써 일부 서비스를 제공하고 있다. (특히 이벤트 페이지) 그중 룰렛 이벤트 페이지를 내가 만들어 제공했는데, 이상하게도 ios에서만 버튼이 동작하지 않는 오류가 있었다. 테스트 모달 처음에는 div type="button"이 안 먹히나보다~ 했다. 마침 디자인이 태그랑 비슷하겠다 a태그로 수정해 봤다. 테스트 모달 결과는 여전히 무반응... 다른 모달 팝업 버튼은 다 먹히는데 왜 얘만 안될까 해서 봤더니 다른 버튼은 button으로 되어있길래 태그로 바꿨다. 디자인을 a태그랑 비슷하게 가져가야 해서 스타일에 라인과 백그라운드를 투명으로 해줬다. ** 최종 ** 테스트 모달 ** 후기 ** 여전히 왜 이런 이슈가 있었는지 모르겠다. 마침 ios ..

함수형 function 장_ 보기 편하다. 확인, 취소 여부에 따라 여러가지 함수나 동작을 지시할 경우 작성이 편하다. 단_ 스크립트 태그를 어디 두느냐, 얼마나 자주 수정이 필요한가 두가지 상황에 따라 코드를 읽으러 오가기 번거로워진다. html _ 태그 내부에 작성 장_ 단순히 지정된 페이지로 이동할 지 아닌지 여부만 확인할 거라면 쓰기 좋다. 단_ html 테그 내부에 쓰는거라 기능과 프론트가 구분 안되어 다소 번잡할 수 있다. 삭제

mysql_fetch_array와 mysql_fetch_assoc를 보면 둘은 쓰는 방식도 똑같은데 왜 함수가 2가지일까, 둘의 차이가 대체 뭘까 고민을 했습니다. print_r을 써보면 확실하게 차이를 알 수 있다길래 해봤습니다. 출력할 테이블 idx name age 1 emily 20 3 nick 35 5 json 14 SELECT * FROM member oder by idx asc; mysql_fetch_array (PHP 5 이전) (= mysqli_fetch_array 또는 fetch_array ) Array ( [0] => 1 [idx] => 1 [1] => emily [name] => emily [2] => 20 [age] => 20 ) mysql_fetch_assoc (PHP 5 이전) ..

일단 이야기는 다음과 같습니다. DB에서 조회한 내용들을 List로 보여주는 list.php가 있습니다. 저는 이 내용을 EXCEL로 다운로드하고자 PHPExcel 라이브러리를 사용하는 코드를 작성하였습니다. 그리고 해당 코드가 길어서 따로 분리하고자 별도의 excel_down.php를 만들었는데 이때 조회 조건을 GET으로 넘겨 excel_down.php에서 DB를 조회하게 했습니다. 이 경우 list.php의 조회 쿼리를 수정하면 excel_down.php도 똑같이 수정해줘야 하는 단점이 있죠. 그래서 유지보수를 용이하게 하기 위해 list.php에서 DB를 조회하고 그 결과를 excel_down.php가 넘겨받는 방식으로 바꾸고자 했습니다. 첫번째 시도 조회 쿼리(문자열)를 주고받기 list.php..

excel을 이용해 DB로 데이터를 입력할 때, 값에 띄워쓰기나 기타 다른 부호가 있으면 완전히 다른 값으로 인식하게 됩니다. 이렇게 되면 JOIN도 먹히지 않죠. 때문에 JOIN될 테이블의 외래키(Foreign Key)와 새로 등록될 테이블의 외래키가 동일한지 확인하는 작업이 필요합니다. 저는 VLOOKUP을 이용해 아래와 같이 외래키를 확인합니다. =VLOOKUP('새로 등록될 테이블의 외래키','JOIN될 테이블의 외래키 목록(행열고정)',1,FALSE) 그런데 결과로 나와야 할 값 대신에 다른 행의 값을 반환하는 오류가 생겼습니다. =VLOOKUP(E3,$B$3:$C$9,2,FALSE) 분명 수식에는 오류가 없었는데 원인을 몰라 해매다가 대체제로 =EXACT를 썼습니다. 그러다 파일을 열 때마다 ..