2016-03-07 47 views
0

我寫了一個jQuery腳本,它檢查瀏覽器的高度並與內容面板的高度進行比較。如果面板大於窗口高度,那麼腳本會使所有內容變小。FF和Chrome的不同視圖 - 找不到原因(也許FF錯誤?)

它適用於Chrome和Safari。在Firefox上它根本不工作。任何人都可以告訴我什麼導致問題的詳細?

鏈接到網站: http://design.maxxcoon.com/bestlife/webinar_chat/

+1

100%的我一樣,確定我發現差異並回答。 –

+0

在Chrome(39.0)中沒有看到任何縮放效果,FF(31.2)給我正常的最小/最大寬度縮放,就是這樣。你可以通過像'font-size:calc(8pt + 1vh);'這樣的方式在純CSS中尋找效果,它會在8pt時鎖定最小字體大小,但會爲其增加1%的窗口高度,方式。 – abluejelly

+0

您必須重新加載以查看縮放效果。 – Shaggy

回答

0
$(document).ready(function() { 
    setTimeout(function() { 
     $(window).bind('resize', reSize($('#blocker'))); 
     $(window).trigger('resize'); 
     var windowSize = $(window).height(); 
     var containerHeight = $('.newcontainer').height() + 50; 
     var containerWidth = $('.newcontainer').width(); 
     var pixelToMuch = 0; 
     var divFactor = 0; 
     var newWidth = 0; 
     if (containerHeight > windowSize) { 
      pixelToMuch = containerHeight - windowSize; 
      divFactor = pixelToMuch * 1.67; 
      newWidth = containerWidth - divFactor; 
      $('.newcontainer').css('width', newWidth + 'px'); 
     } 
    }, 100); 
    setTimout(function() { 
     $('#chatfenster').css('height', $('.newcontainer').height() - 260 + 'px'); 
     $('#userlist').css('height', $('.newcontainer').height() - 350 + 'px'); 
    }, 150); 
}); 
+0

謝謝,但是這並沒有解決我的問題:( 它仍然不工作在FF:http://design.maxxcoon.com/bestlife/webinar_chat/ – Shaggy