Исправление параметра JQuery Vh для старых браузеров

Question

Итак, я недавно использовал vh и единиц внутри CSS3 и любя, как они работают. К сожалению, с их поддержкой только с современными версиями браузеров мне пришлось найти работу, чтобы получить представление, которое я хотел получить на своем сайте.

При исследовании я нашел исправление в другом потоке, выполненном в JQuery, который отлично работает до тех пор, пока не будет сделано изменение размера порта вида (то есть изменяется либо масштаб окна, либо мобильное устройство повернуто в противном случае.) Когда вы это делаете, высота div увеличивается на странице вниз. Если бы вы могли помочь мне решить эту проблему, я был бы очень благодарен.

Сайт, который я работаю на это: http://phantommarketing.co.uk/rapidengineering/index.html

HTML в области воздействия, при активации в линии Javascript

<div id="fullscreen_img"> 
    <img src="images/rapidlogo.svg" alt="Rapid Engineering Logo" id="rapidlogo"> 
</div><!--END OF FSIMG--> 

<script type="text/javascript"> 
    // Init object 
    var supportVhVw = new SupportVhVw(); 

    // Scale all texts 
    supportVhVw.setVh("#fullscreen_img", 100); 
</script> 

Javascript

function SupportVhVw() { 

    this.setVh = function(name, vh) { 

     $(window).resize(function(event) { 
      scaleVh(name, vh); 
     }); 

     scaleVh(name, vh); 
    } 

    this.setVw = function(name, vw) { 

     $(window).resize(function(event) { 
      scaleVw(name, vw); 
     }); 

     scaleVw(name, vw); 
    } 

    var scaleVw = function(name, vw) { 

     var scrWidth = jQuery(document).width(); 
     var px = (scrWidth * vw)/100; 
     var Fwidth = jQuery(name).css('width', px + "px"); 
    } 


    var scaleVh = function(name, vh) { 

     var scrHeight = jQuery(document).height(); 
     var px = (scrHeight * vh)/100; 
     var Fheight = jQuery(name).css('height', px + "px"); 
    } 
}; 

Answer 1

Вместо того, чтобы высота документа и ширина высоты и ширины видового экрана

var scaleVw = function(name, vw) { 

       var scrWidth = $(window).width(); 
       var px = (scrWidth * vw)/100; 
       var fontSize = jQuery(name).css('width', px + "px"); 
      } 


      var scaleVh = function(name, vh) { 

       var scrHeight = $(window).height(); 

       var px = (scrHeight * vh)/100; 
       var fontSize = jQuery(name).css('height', px + "px"); 
      } 

Я тестировался в Internet Explorer 8 работает нормально