A Joyful AI Research Journey🌳😊

230328 Tue, 230329 Wed 기본틀은 아래와 같고 input에 name, type, id 등 다양한 걸 넣을 수 있다. 검색하면 보통 전체 약관 동의만 떠서 그런데 선택 약관 코드도 넣었다. 코드) 전체 약관, 선택 약관, 이메일, SMS 각 눌렀을 때 체크박스 체크되게 만들기 //전체 약관 동의 function checkAll() { if ($("#TermsOfService").is(':checked')) { $("input[name=sub_TermsOfServiceRequired]").prop("checked", true); } else { $("input[type=checkbox]").prop("checked", false); } } //선택 약관 동의 function checkOpti..

230125 ~ 230210 약 15일간 프론트엔드를 진행한 스크린샷이다. 깃허브 링크▼ https://github.com/yjyuwisely/Traveling-from-Ulju-gun

230210 Fri 31st class [15th day for portfolio :)] 돋보기 검색 기능 넣기 디자인: 책 넓김 효과 마우스 움직일 때 화면 변경됨 마스코트: - 모두 투어 참고: 마우스 호버 때 사진 크기 커짐 완료 https://www.modetour.com/main/default.aspx - 마우스 오버 효과 완료 https://www.codingfactory.net/12584 - 굳이 메인에 공지 후기 게시판 넣어야하나?(생각중):0 : 공지, 후기, 자유게시판 - 첫번째 슬라이드쇼 사진 작아졌다가 커짐 효과 넣어도 된다. - 비밀번호 유효성 검사 완료한다. -react 책 참고 or 제이쿼리 참고 가능 view-source:https://www.ybtour.co.kr/accou..

230209 Thu 30th class [14th day for portfolio :)] - 돋보기 검색기능 넣기 - 오븐 다시 수정하기 (면접관이 본다. :0) https://ovenapp.io/project/ZvSsnVLukUxo8fwKUNtKD4xrnZRh9TZC#Eg8SZ 디자인: 책 넓김 효과 마우스 움직일 때 화면 변경됨 마스코트: - 썸네일 넣는다.(완료) (1. 교통 정보 2. 숙박 정보 3. 음식점 정보 4. 레저, 스포츠 5. 특산물 6. 축제, 대회) - 모두 투어 참고: 마우스 호버 때 사진 크기 커짐 https://www.modetour.com/main/default.aspx - 마우스 오버 효과 https://www.codingfactory.net/12584 - 굳이 메인에 공지..

230208 Wed 29th class [13th day for portfolio :)] - 돋보기 검색기능 넣기 - 썸네일 넣는다. (1. 교통 정보 2. 숙박 정보 3. 음식점 정보 4. 레저, 스포츠 5. 특산물 6. 축제, 대회) - 모두 투어 참고: 마우스 호버 때 사진 크기 커짐 https://www.modetour.com/main/default.aspx 여행은 모두투어 www.modetour.com - 마우스 오버 효과 https://www.codingfactory.net/12584 CSS / 마우스 오버 효과 / 이미지 확대 이미지에 마우스를 올렸을 때 이미지가 확대되는 효과를 만들어보겠습니다. 우선 다음과 같이 이미지가 들어간 간단한 HTML 문서를 만듭니다.

230207 Tue 28th class [12th day for portfolio :)] 돋보기 검색기능 넣기 썸네일 넣는 거 생각해본다. (1. 교통 정보 2. 숙박 정보 3. 음식점 정보 4. 레저, 스포츠 5. 특산물 6. 축제, 대회) 모두 투어 참고: https://www.modetour.com/main/default.aspx 여행은 모두투어 www.modetour.com 푸터: 연하게(완) 자세히 알아보기: bold(완) 마우스 호버 때 사진 크기 커짐 첫번째 슬라이드쇼 사진 작아졌다가 커짐 효과 마우스 오버 효과 https://www.codingfactory.net/12584 CSS / 마우스 오버 효과 / 이미지 확대 이미지에 마우스를 올렸을 때 이미지가 확대되는 효과를 만들어보겠습니다. ..

230206 Mon 27th class [11th day for portfolio :)] 우선 해야할 것은 1) 메인 화면: - 아이콘 6개 추가 아무리 생각해봐도 동그란 썸네일이 나은 것 같다. 이미지 6개 찾는다. (1. 교통 정보 2. 숙박 정도 3. 음식점 정보 4. 레저, 스포츠 5. 특산물 6. 축제, 대회) - 크기 조정 (%로) (완료) - 슬라이드 쇼의 More 누르면 그 정보 페이지로 이동 (아직 X) 동구 문화관광축제 사이트 참고) https://www.donggu.ulsan.kr/tour/cmm/main/mainPage.do - 날씨 위젯, 검색어 기능 추가 - 두번째 슬라이드 쇼 반복 재생 버튼 일시정지 버튼 만들기(생각중) - css 코드 깔끔하게 만들기 :) - 메뉴 코드 게시..

230204 Sat [9th day for portfolio :)] 230205 Sun [9th day for portfolio :)] -울산 관광 가이드북 참고하기 2023.01.18 - [2. 포트폴리오/자료 수집] - *자료) 울산 울주군 관광지 리스트 및 관광가이드북 다운로드 새로 알 게 된 것 CSS는 같은 속성을 여러 번 정의했을 때, 나중에 설정한 값이 적용된다. 만약 나중에 설정한 값이 적용되지 않게 하려면 속성값 뒤에 !important를 붙인다. property: value !important; vh = viewport height, vw = viewport width 즉, 현재 실행중인 스크린 크기에 맞춰 상대적 크기를 반환하겠다는 뜻이다. 100vh, 100vw가 전체 화면의 기준이..

230203 Fri 26th class [8th day for portfolio :)] 우선 해야할 것은 1) 메인 화면: - 게시판(공지사항) 넣기 - 공지사항 아이콘을 우측 상단에 넣거나 세부 메뉴에 넣기 (완료) - 슬라이드 쇼 이미지 사이즈 조절 및 8개 이미지 추가 (완료) - 아이콘 6개 추가 - 슬라이드 쇼의 More 누르면 그 정보 페이지로 이동 동구 문화관광축제 사이트 참고) https://www.donggu.ulsan.kr/tour/cmm/main/mainPage.do | 울산광역시 동구 문화관광축제 www.donggu.ulsan.kr - css 코드 깔끔하게 만들기 :) - 메뉴 코드 게시글 올리기 - 날씨 위젯, 검색어 기능 추가 - 두번째 슬라이드 쇼 반복 재생 버튼 일시정지 버튼..

230202 Thu 25th class [7th day for portfolio :)] 우선 해야할 것은 1) 로그인 페이지: 화면 설계 완료하기 2) 메인 화면: 게시판(공지사항), 슬라이드쇼 추가한다. - 드롭다운 메뉴로 수정하기 (완료) https://www.w3schools.com/howto/howto_css_dropdown.asp https://www.w3schools.com/howto/howto_css_mega_menu.asp 모두 투어 메뉴 참고한다. https://www.modetour.com/main/default.aspx How To Create a Mega Menu W3Schools offers free online tutorials, references and exercises in..

230201 Wed 24th class [6th day for portfolio :)] 우선 해야 할 것은 1) 로그인 페이지: 화면 설계 완료하기 2) 회원 가입 페이지 - 약관 (내용 보기) 추가 3) 메인 화면: 게시판(공지사항), 슬라이드쇼 추가한다. - 드롭다운 메뉴로 수정하기 모두 투어 메뉴 참고한다. https://www.modetour.com/main/default.aspx 여행은 모두투어 여행은 모두투어 www.modetour.com 4) 슬라이드 쇼 이미지, 아이콘 등 디자인 부분 완료한다. 5) - 라디오 버튼: 커스텀하기 https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_custom_radio https://www.w3sc..

230131 Tue 23rd class [5th day for portfolio :)] 2/10까지 html, css 부분 완료해야 하므로 자바스크립트, 제이쿼리 부분보다 우선 html, css 부분을 완료하도록 한다. html, css 완료 후 자바스크립트, 제이쿼리 진행한다. 우선 해야할 것은 1) 로그인 페이지: 화면 설계 완료하기 2) 회원 가입 페이지 - 약관 (내용 보기) 추가, 로그인, 로고 (링크 걸기)(완료) - 비밀번호 입력시 글자 보이게 하는 아이콘 로고 부분(완료) 3) 메인 화면: 게시판(공지사항), 슬라이드쇼 추가한다. - 드롭다운 메뉴로 수정하기 모두 투어 메뉴 참고한다. https://www.modetour.com/main/default.aspx 여행은 모두투어 여행은 모두투..

230130 Mon 22th class [4th day for portfolio :)] 학원 강사님의 요청) 일정: 2월 10일까지 카카오오븐을 통해 설계한 화면 html/css 완성시켜 주세요. javascript는 그 후에 적용하셔도 됩니다. 우선 지금 남은 것은 1) 회원가입 화면 설계: 우선 회원가입 화면 구현은 했는데 아직 남은 것은 (필수) 약관 전체 동의 (선택) 약관 전체 동의 부분이다. - if 전체 동의 시 3개 선택, 선택 동의시 2개 선택 if 3개 선택 시 전체 동의 클릭됨, 2개 선택시 선택 동의 클릭됨 참고) https://gangzzang.tistory.com/entry/%EC%A0%9C%EC%9D%B4%EC%BF%BC%EB%A6%ACjQuery-%EC%84%A0%ED%83%..

230127 Fri 21th class [3rd day for portfolio :)] 지난 수업에서 기억 할 것 메뉴 만들 때 (교재: HTML5 + CSS3 + JavaScript로 배우는 웹프로그래밍 기초 p. 261 참고하기) HTML 로그인 회원가입 CSS #login { display: table-cell; width: 200px; /*너비*/ height: 10px; /*내비게이션 영역 높이 */ border: dotted red; } #login ul{text-align:center;} #login ul li{display:inline;} #login ul li a{text-decoration:none; color:navy;} 할 것 1) 첫번째 교재의 p. 262 참고해서 line-hei..

230126 Thu 20th class [2nd day for portfolio :)] 첫번째 계획의 이미지처럼 HTML, CSS를 이용해서 우선 메인 페이지 레이아웃만 잡았다. 세부 메뉴 페이지들도 화면 설계 계획 이미지로 만들어야하고 아직 메인페이지에도 아직 해야할 게 많다.