반응형 웹사이트 관련 문의
오류가 나는곳의 주소를 알려주시면 더 빠르고 정확하게 답변 받을 수 있습니다.
오류 주소 : 없음
반응형 웹사이트를 제작해서 만들어보고 있습니다.
그런데 궁금한 부분이 생겼습니다.
그누보드 게시판을 보면..
" 번호 | 제목 | 글쓴이 | 날짜 | 조회수 "
위와 같이 리스트화면이 구성되어 있습니다.
이걸 반응형 웹사이트로 만들었을때..
pc 화면 min-width:1025px 이상에서는 "번호|제목|글쓴이|날짜|조회수"가 모두 보이게하고..
min-width와 max-width 를 조절해서 일정 사이즈안에 속하게되면..
"번호|제목|글쓴이|날짜"
"제목|글쓴이|날짜"
"제목|글쓴이"
이런식으로 리스트 자체를 보이지 않도록하는것도 가능한가해서요.
반응형 웹 소스 자료를 보면.. style 을 이용해서 위치를 재구성해서 width 수치에 따라 화면에 표현하도록은 되어있지만 있고? 없고? 를 처리하는건 안보이는것 같더라구요.
궁금합니다.
오류 주소 : 없음
반응형 웹사이트를 제작해서 만들어보고 있습니다.
그런데 궁금한 부분이 생겼습니다.
그누보드 게시판을 보면..
" 번호 | 제목 | 글쓴이 | 날짜 | 조회수 "
위와 같이 리스트화면이 구성되어 있습니다.
이걸 반응형 웹사이트로 만들었을때..
pc 화면 min-width:1025px 이상에서는 "번호|제목|글쓴이|날짜|조회수"가 모두 보이게하고..
min-width와 max-width 를 조절해서 일정 사이즈안에 속하게되면..
"번호|제목|글쓴이|날짜"
"제목|글쓴이|날짜"
"제목|글쓴이"
이런식으로 리스트 자체를 보이지 않도록하는것도 가능한가해서요.
반응형 웹 소스 자료를 보면.. style 을 이용해서 위치를 재구성해서 width 수치에 따라 화면에 표현하도록은 되어있지만 있고? 없고? 를 처리하는건 안보이는것 같더라구요.
궁금합니다.
|
댓글을 작성하시려면 로그인이 필요합니다.
로그인
댓글 10개
display:hidden; 이랑.. visibility:hidden; 이랑 무슨 차이가 있는거에요?
http://sir.co.kr/bbs/board.php?bo_table=pb_tip&wr_id=2305&page=2
감사합니다!
코드 짜면서 생각하지 않고 만들던것들이 이런 부분이었는데 앞으로는 이해도를 올리는 시간을 많이 가져야겠네요.
none
입니다 잘못 타이핑 된것입니다...
display:none 과 display:hidden 은 매우 다릅니다.
둘다 특정 element 가 보이지 않게 되는 것은 같지만, display:hidden 은 단지 눈에만 보이지 않을 뿐 자리를 차지 합니다.
그래서 반응형으로 레이아웃을 짤때 display:none 을 사용하지 display:hidden 을 쓰는 경우를 보지 못했습니다.
공간이 협소해서 필요없는걸 빼버리는게 목적인데, display: hidden 은 눈에만 보이지 않지, 공간은 계속 차지하니까요...
분명 이렇게 적었는데 누가 수정한거죠~~~~~ㅋㅋ
잠결인가 봅니다~ ㅜㅜ
var $wrapper = $('#wrapper'); //CSS가 바뀔 최상위 Wrapper
var className = 'test'; // 대표 클래스명
var contentAreaWidth = $(window).width();
naviW = $(".naviBg").width();
// 해상도별 클래스 셋팅 class='test_1200'
if (contentAreaWidth > 720) {
$wrapper.removeClass().addClass(className + '_1200');
}
// 웹 최소 사이즈일때 class='test_800'
else {
$wrapper.removeClass().addClass(className + '_800');
}
}
// 윈도우 리사이즈
$(window).resize(function () {
set_resize();
});
css
.test_1200 #wrapper .menu {display:block}
.test_800 #wrapper .menu {display:none}
참고해서 잘 쓰겠습니다!
감사합니다!
hidden 처리시에는 위 답변해주신분들의 참고글 내용에도 있듯이 화면에서만 보이지 않을뿐 남아있는것처럼..
실제 게시판에 적용시키니.. 해당 구역이 계속 잔존하게되더군요.
none 처리하니 구역까지 완전히 사라져버립니다.
좋은 참고 자료가 되었습니다.
답변해주신분들 감사합니다!