첨부파일 https://eond.com/blog/360914

layout_sub_20150820.png


#왼쪽 상단 버튼의 역할

1. 기대되는 역할 : 왼쪽 사이드 메뉴의 펼침 메뉴

- 문제점 

1) 반응형으로 레이아웃 너비가 일정 너비 이하로 줄어들었을 경우 사라진 상태일 때, 

펼침 메뉴를 클릭한 경우, 다시 브라우저 넓이를 줄이면 해당 사이드바가 줄어들지 않고 펼침 상태 그대로 유지됨

> 문제가 아닐 수도 있음. 반응형을 사용하는 이유는 단순히 사용자의 기기에 따라 적합한 레이아웃을 보여주는 것이고,

브라우저의 가변성은 고려하지 않아도 됨.    

- 해결방법1

풀브라우징일 경우 해당 펼침 메뉴를 보이지 않게 처리한 후, 사이드바가 사라지는 너비 이하일 경우 다시 나타나게 하는 방법

> 문제점1의 현상이 그대로 나타날 수 있음

- 해결방법2

펼침메뉴와 사이드바의 관계를 분리시키기

1) 사이드바는 반응형 레이아웃의 종속 관계에 따라 나타났다 사라지는 역할을 그대로 수행

2) 펼침메뉴는 사이드바와는 별개의 펼침메뉴의 종속된 눈에 보이지 않는 브라우저 영역 바깥의 숨김 레이어가 나타나도록 처리함.

예) http://www.berriart.com/sidr/ (브라우저 넓이를 줄이면 반응형 메뉴가 나타남)

코멘트 0
접기/펴기 | 댓글 새로고침
 
 
Total 164 articles in 6 / 11 pages
번호 제목 제목 날짜날짜
공지 이온디에서 제작 배포 중인 레이아웃 2013/03/13
89 [XE기타] [XE위젯] 이온디 파일박스 배너위젯 2015/09/09
88 [레이아웃제작기] [이온디 에디션] 모바일에서의 터치슬라이딩 구현하기 파일 [2] 2015/09/01
87 [레이아웃제작기] [이온디 레모나] 참조 사이트 2015/08/29
86 [XE기타] 구매 페이지 템플릿 2015/08/26
85 [XE기타] 만들어볼 스타일의 레이아웃 2015/08/25
84 [레이아웃제작기] [이온디 에디션] 사이드바가 있는 경우 반응형 레이아웃의 컨텐츠 코딩 방법 2015/08/22
현재글 [레이아웃제작기] [이온디 에디션] 반응형 메뉴의 역할 2015/08/22
82 [레이아웃제작기] [이온디 에디션] 참조 반응형 웹사이트 2015/08/21
81 [레이아웃제작기] [이온디 온] 헤더 위젯 파일 2015/08/20
80 [레이아웃제작기] [이온디 에디션] 시안 20150820 파일 2015/08/20
79 [레이아웃제작기] 이온디 온 - 메인 작업 완료 80% 2015/08/18
78 [레이아웃제작기] 이온디 온 - 컨텐츠 위젯 디자인 2015/08/18
77 [레이아웃제작기] 이온디 온 - 컨텐츠 위젯 2015/08/12
76 [레이아웃제작기] 이온디 온 - 통합검색 2015/08/09
75 [레이아웃제작기] 이온디 온 레이아웃 로그인 UI 기획 러프 스케치 파일 2015/07/04

해시태그 디렉터리