벌써 test5 입니다.
이번에는 앞에 해결 안되던 문제점과 구조를 살짝 바꿔봤습니다.
저번과 크게바뀐건 없지만 header 부분에 logo-box, menu-box로 나눠서 구조를 만들어 봤습니다.
main부분에는 양 옆에 여백을 주기위해 air-left,right를 넣었지만 깔끔하지 못하네요
CSS로 저렇게 여백을 주려니 문제가 생겨서 일딴 임시방편으로 해두었습니다.
header쪽에 집중하죠 ㅎㅎ
맥에서 찍다보니깐 너무 크게나온거같다. 스타일은 위와 같이 적용시켰다.
제일 중요한 js부분이다.
밑에 2개의 클릭이벤트는 기존과 달라진건 없다 달라진게 있다면 if문을 추가했다.
그 동안 문제점이 햄버거 버튼을 클릭해서 메뉴가 나와서 창 사이즈가 760이하 일때는 유지가되고 761이상일때는
사라지게 해야되는데 test1~4에서는 그게 안되서 사이즈를 늘리면 그 전 이벤트가 겹쳐버렸다.
처음에 if문을 직접 했을때는 사이즈를 변경할때마다 메뉴가 닫히는 이벤트가 되버려서 고민을 좀 해봤는데 해결이
안되가지고 존경하는 선생님과 인터넷까페에다가 올려서 해답을 얻어 해결하였다.
if($(this).width() >=761) {
//761이상일때
} else {
//760이하일때
}
이번에는 스스로 해결하지 못했지만 물어보고 해결하는것 또한 좋은 경험이였다.
