본문 바로가기

전체 글

 (42)
11-17 오이도 선사유적 공원 메인 슬라이드 반응형 Swiper plugin 사용. 오류 :: 슬라이드를 배치했을 때 헤더 메뉴와 겹치지 않게 보이는 문제 스와이퍼 플러그인 내의 css 수정 :: position : absolute 로 변경, z-index 값 변경, height 값 추가, 상위 wrapper의 overflow hidden 삭제 :: Pagination 추가, 백그라운드 이미지에 span 태그 추가, 슬라이드 순서 변경, fade 효과 변경, :: position : relative 값과 absolute 정리 :: 메인 슬라이드의 span 수정 :: 슬라이드 밑의 main_cutter 수정 :: 태그 정리 :: 반응형 처리 ( 해상도에 따라 height 값 조정 ) :: 반응형으로 했을 시 해당 스폰태그가 position 위치가 잘못 잡히..
오이도선사유적공원 반응형 헤더2 제이쿼리 상단 메뉴 제이쿼리 ( 헤더를 호버했을 때 메뉴의 이미지와 색상이 변하는 효과 ) 제이쿼리 수정 ( 해상도에 따라 제이쿼리 실행이 되게끔 ) 해상도가 900이상일 때 해상도가 900 미만일 때 ( 서브메뉴가 안보이고 모바일용 사이드 메뉴가 나오게끔 ) ++ 기타 반응형 수정 모바일 사이드메뉴 모바일 메뉴 ( 좌우로 슬라이드 ) 제이쿼리. 깃허브 주소 github.com/wonpoem/oido/tree/main/oido2 wonpoem/oido Contribute to wonpoem/oido development by creating an account on GitHub. github.com 라이브 서버 rkqtlr15159.cafe24.com/oido2/
오이도선사유적공원 메인 홈페이지 반응형 헤더 오이도선사유적공원 홈페이지 마크업 ( html + css + jquery + javascript ) 시작. 코딩하면서 해결한 오류 + 해결 및 개선 방식 : 1. 반응형 작업시, 스크롤이 안생기게 하거나 컨텐츠가 스크롤에 가려 안보이는걸 방지하기 위해 미디어쿼리 해상도 분기점 사이즈마다 width 값을 100퍼센트를 넣어준다. 2. 헤더 메뉴 - 서브메뉴 작업 시 백그라운드는 포지션 fixed 로 작업하고 저렇게 각각의 li 마다 패딩값을 다르게 주는 코딩법이 아니라 각 li들 마다 양 padding값은 동일하게 주고 width값만 따로 조절해주는 방식으로 코딩을 해야 추후에 서브메뉴 관리가 용이하다. ( 메뉴를 바뀌게 될 시 ) 3. css hover 밑줄 애니메이션 1920 해상도 1920 해상도 :..

티스토리툴바