포럼
전문가를 상대하기는 힘들어...
2014.04.14 00:05
요즘 유행이 상단 메뉴가 마우스를 따라다니는 position:fixed가 유행이라 그런 작업을 하나 했었다.
그런데 이런 레이아웃은 정확하게 가변형이 안되면(일정 넓이 이하에서 메뉴 버튼이 있고 클릭했을때 펼쳐지는 형태) 약간 문제 아닌 문제가 생긴다.
fixed라는게 항상 브라우져를 따라다니기에 전문가들이 브라우져 넓이에 따른 반응을 본다고 줄였다 늘였다 해 버리면 넓이를 일정이상 고정해 버리면 (메뉴를 우측에 붙혀둘 경우) 고정 넓이 이하에서는 메뉴 일부에 접근이 힘들어 진다.
하단의 마우스 휠을 이동할때마다 header 부분이 좌측에 달라 붙어서 같이 이동하다 보니.... 접근 자체가 안되는 문제가 생기고...
그렇다고 넓이 고정을 안해 버리면 일정 넓이 이하(전체 메뉴 넓이보다 브라우져를 넓이를 줄였을때)에서는 자연스럽게 메뉴가 하단으로 내려오게 된다.
그래서 나름 메디어 쿼리를 이용해서 일정 넓이 이하에서는 메뉴간 간격을 줄이는 방식으로 960px 까지는 메뉴가 안깨지도록 작업을 해 뒀었는데...
이런...
전문가님이 그 이하에서는 메뉴가 안깨지면서 fixed를 유지해 달라고 하신다...
한참 전문가님께 설명을 했지만
일반 모니터는 요즘에는 960 이하의 모니터가 없고 모바일에서는 기본 넓이를 다 먹고 들어가기에 문제가 없다고 했지만
자신이 아마추어가 아니라는 답변만...
정말 전문가와 작업하는것은
참 힘든 일인거 같다.
댓글 2
-
W.O
2014.04.14 01:04
-
ForHanbi
2014.04.14 09:33
fixed 라는게
메뉴 부분의 넓이를 고정 안해주면
전체 메뉴 넓이보다 모니터 화면이 좁아질때 넘치는 메뉴 부분은 자연스럽게 아래로 떨어질 수 밖에 없스비다.
쉽게 생각해서 1000px 넓이에 100px 넓이의 메뉴를 20개 넣어두면 두줄이 되는 이치와 같습니다.
아무리 해도 100px 짜리 메뉴를 1000px 안에 20개를 나열 할 수 없죠.
그런데 만약 메뉴 부분을 2000px로 고정해서 20개를 인위적으로 나열시켜 버린다면
fixed라는 놈이 항상 브라우져 우측이나 좌측에 따라다녀야 하기에 브라우져 넓이를 넘어서는 메뉴에 대해서는
만약 1000px의 넓이라고 한다면 절반의 1000px 부분은 하단의 마우스 휠을 아무리 돌려도
평생 죽을때 까지 왔다갔다 해도 접근이 안됩니다.
요즘들어 가변형이라면서 브라우져를 줄이고 늘이고 하면서 테스트를 하는 분들이 많은데
이건 실질적으로 1024 이상의 모니터에서 어떻게 반응을 하는가 테스트 하는 용도이고
1024이하 모니터에서는 모바일용으로 접근을 하고 그에 맞게 고민을 해야 하는데
1024 이상의 접근법과 그 이하의 접근법에 대해 충분히 고민을 안하고 가변이나 반응이라는 단어를 떠올려서 적용하려 하기에 생기는 문제입니다.
하위 div에 float를 주면 메뉴가 다 보이도록 할 수 있지 않을까요?
블랙코미디에 진지하게 반응해서 죄송...