JQuery не изменяет размер div на размер окна

Question

Итак, у меня есть функция JQuery, которая построена так, чтобы высота столбцов была одинаковой. Он проверяет размер экрана, и если он находится на устройстве среднего размера или больше, он изменит размер столбца на одну и ту же высоту. Эта часть функции отлично работает. Однако, если он будет изменен до размера мобильного телефона (или чего-нибудь меньше 1025 пикселей), высота не будет сброшена до исходного размера и останется на увеличенном размере. Если он запускается на маленьком экране, он будет отображаться правильно до тех пор, пока он не изменится на большой экран, а затем снова изменится на маленький экран (тогда возникает та же проблема, что и выше).

Вот код!

$(document).ready(function(){ 
     matchColHeight('.intro-pic', '.intro-desc-container'); 

     $(window).resize(function(){ 
      matchColHeight('.intro-pic', '.intro-desc-container'); 
     }); 
    }); 

    function matchColHeight(tallColumn, shortColumn){ 
     shortOriginalHeight = $(shortColumn).height(); 

     if (window.matchMedia('(min-width: 1025px)').matches) { 
      height = $(tallColumn).height(); 
      $(shortColumn).css({ 
       'height': height + 'px' 
      }); 
     } 
     else{ 
      $(shortColumn).css({ 
       'height': shortOriginalHeight + 'px' 
      }); 
     } 
    } 

Примечание: Я также попытался с помощью приведенной ниже функции и имели одни и те же вопросы:

function matchColHeight(tallColumn, shortColumn){ 
     shortOriginalHeight = $(shortColumn).height(); 
     screenSize = $(window).width(); 

     if (screenSize > 1025){  
      height = $(tallColumn).height(); 
      $(shortColumn).css({ 
       'height': height + 'px' 
      }); 
     } 
     else{ 
      $(shortColumn).css({ 
       'height': shortOriginalHeight + 'px' 
      }); 
     } 
    } 

Заранее спасибо!

Answer 1

Законченное решения моего вопроса, изменив функцию на следующее:

function matchColHeight(tallColumn, shortColumn){ 
    if (window.matchMedia('(min-width: 40em)').matches) { 
    height = $(tallColumn).height(); 
    $(shortColumn).css({ 
     'height': height + 'px' 
     }); 
    } 
    else{ 
     $(shortColumn).removeAttr('style'); 
    } 
} 

Вместо того, чтобы хранить исходную высоту и возвращаясь назад к нему, я просто удалил измененную высоту, когда она не нужна.