완성된 모습은 아래 링크에서 확인해보세요 http://dev.webbyist.com/publishing/test1/index.php 헤더 스타일 dev.webbyist.com 로고는 좌측 메뉴는 우측에 나열이 되는 형태로 만들어볼게요 먼저 아래는 스타일링이 전혀 안된 헤더 요소입니다 회사 홈페이지 헤더 메뉴 홈 About Corporation Business Contact Us 찍어보면 아래처럼 나오는데요 a태그에 파란색+라인이 들어가있네요 없앱시다 아래 css코드를 추가하면 되겠죵 a:link, a:visited, a:hover, a:active {color:#333;) 그다음 안에 있는 로고 및 메뉴요소들을 좌측, 우측으로 나열되게 꾸며볼게요 header {display: flex;justify-co..
데모페이지 https://www.jqueryscript.net/demo/jQuery-Plugin-For-One-Page-Navigation-Plugin-Page-Scroll-To-ID/examples/ jQuery Page Scroll To ID Basic Demo Section 7 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis a..
https://michalsnik.github.io/aos/ AOS - Animate on scroll library AOS Animate On Scroll Library Scroll down michalsnik.github.io css js initialize aos AOS.init(); github https://github.com/michalsnik/aos michalsnik/aos Animate on scroll library. Contribute to michalsnik/aos development by creating an account on GitHub. github.com Animations Fade animations: fade fade-up fade-down fade-left fade-..
제작 중단건으로 완성중인 홈페이지 변경사항 두번째 주요실적 부분 기존 홈페이지에서는 아래 페이지네이션을 클릭하면 페이지가 넘어가는 형식으로 되어 있었다. 사용자 입장에서도 좀 불편할 수 있고 저 부분을 관리자페이지에서 컨트롤할 수 있어야 되는 개발문제에 있어서도 좀 더 간단하게 할 수 있는 방법을 생각해서 결국 슬라이드 형식으로 가로로 넘길 수 있게 변경을 하게 되었다. 변경하고 보니 확실히 페이지네이션 2를 눌렀을 때 페이지 전환이 되지 않고 볼 수 있다는 게 편리했다. 저렇게 하기 위해서는 슬라이드 안에 슬라이드를 구현할 수 있어야 되기 때문에 구글링을 좀 했다. 몇번 검색해보니 원하는 코드를 찾을 수 있었고 바로 적용.
홈페이지 외주건으로 제작이 90% 완료된 시점에서 중단되어 완성을 위해 제작을 맡게 된 건이다 - 헤더 변경 사항 - 기존 : 마우스 오버시 각각의 메뉴마다 따로 소메뉴가 나오는 형태라 약간의 불편함이 있음 현재 : 마우스 오버시 전체 메뉴와 소메뉴를 한번에 볼 수 있음 로고와 메뉴들이 좁게 뭉쳐진 느낌이였고 지금은 확 트여보이게 변경되었다. 마우스오버시 소메뉴 아래에 border가 1px로 애니메이션이 들어갔는데 width가 0px인 상태에서 0.2초간 가로 100%로 변경(중간에서 시작해서 좌우로 꽉 차게) 기존의 헤더 css소스를 약간의 추가, 수정을 통해 변경하였다. 애니메이션 transition 기술에 있어서 display: none 항목이 있어선 먹히질 않기 때문에 이 부분을 주석하고 이리저리..