미디어 쿼리가 변경되면 Jquery 함수를 삭제하십시오.

Question

당신이 나를 도울 수 있기를 바랍니다.

포럼을 통해 검색 한 결과,이 중 하나가 특별한 경우라고 생각됩니다.

프로젝트는 미디어 쿼리 (반응 형)로 구동되며 3 열, 때로는 4가 , 높이가이어야합니다. 나는 훌륭한 작품 Jquery에서 스크립트를 개발했습니다.

var maxHeight = 0; 
function setHeight(column) { 
    $(window).load(function() { 
     column = $(column); 
     column.each(function() { 
      if ($(this).height() > maxHeight) { 
       maxHeight = $(this).height(); 
      } 
     }); 

     column.height(maxHeight); 
    }); 
} 

setHeight('.package-container .package-3'); 

아래를 참조하지만 767px 아래, 모바일 버전에 갈거야 언제, 어떻게 내가 페이지를 새로 고침 할 필요없이이 setHeight() 기능을 파괴 않습니다.

다른 대안으로, 아래에서 enquire.js, javascript 미디어 쿼리를 사용하여이 작업을 수행 할 수 있지만 데스크톱/태블릿에서 모바일로 바로 이동하면 새로 고침하지 않고도 작동하지 않습니다.

다음

enquire.register("(max-width:767px)", { 
    match : function() { 
     setHeight(null); 
    } 
}).listen(); 

Answer 1

다음과 같이 당신은 아무것도 간단한 설정을 "파괴"에 대해 걱정할 필요가없는, 모바일 첫 번째 방법에서하는 것입니다 자동으로 높이 :

enquire.register("screen and (min-width : 768px)", { 
    match : function() { 
     // set equal height for columns 
     setHeight('.package-container .package-3'); 
    }, 
    unmatch : function() { 
     // set auto height 
     $('.package-container .package-3').height("auto"); 
    } 
}).listen();