페이지 크기 변경시에만 웹 페이지 리로드

Question

페이지를 새로 고침하는 데 문제가 있습니다. 데스크톱 및 태블릿/모바일 레이아웃 용 RWD 및 미디어 쿼리를 사용하여 사이트를 작성하고 있습니다. 그리고 나는 Google지도를 사용하는 한 페이지를 가지고 있습니다. 내 클라이언트는 그가 바탕 화면 크기에서 모바일 크기로 창의 크기를 조정하면 페이지를 새로 고치기를 원합니다. (나는 이것이 바보 같은 아이디어라고 말하려고했지만 그는 듣지 않았습니다.) 바탕 화면은 마커가있는 모든지도를 표시하지만 태블릿 및 모바일 레이아웃이 다른 경우 아코디언/목록을 사용하여 국가 목록을 표시합니다. 당신이 하나의 요소 폼 아코디언을 클릭하면 그는 구글 맵스 윈도우 인포 박스 (windowinfobox)에서 정보를 보여주는 것을 확장합니다. 그리고 문제는 내가 단지 레이아웃을 변경하지만, 아코디언의 모든 요소가 확장되어있는 미디어 쿼리 ofcourse 만 사용하면 숨김이어야하며, 클릭하면 페이지가 모두 새로 고쳐지기 때문에 페이지가 새로 고쳐지면 문제가있는 것입니다. 문제는 페이지 크기 조정과 관련이 있습니다. . 나는 window.resize (function() {location reload})를 사용했다. 그리고 그것의 작업은 크기 조정과 완벽하게 일치하지만, 모바일 장치에서는 모든 터치가 재배치됩니다. 그래서 윈도우 크기가 xxx에서 yyy로 바뀌면 페이지를 새로 고침하는 함수를 작성하고 싶습니다. 왜냐하면 경계선이 1024px를 넘으면. 아코디언이 완벽하게 표시되기 때문입니다.

Answer 1

나는 이것이 당신이 원하는 것이라고 가정합니다.

$(function(){ 
var width = $(window).width(); 
var screen = ""; 
if(width < 1024 && width >640){ 
    screen = "small"; 
} else if(width>1024) { screen = "big"; } 
$(window).resize(function(){ 
    var cur_width = $(window).width(); 
    if(cur_width<1024 && cur_width>640 && screen == "big"){ 
    location.reload(); 
    } else if(cur_width >1024 && screen == "small"){ 
    location.reload(); 
} 
} 
}