股利调整的窗口调整

Question

我的问题是，当加载内容，所有5个格合身，但是当我调整窗口大小的容器的大小doesn't不合适了布局。

// fittocontainer 
    jQuery.fn.fittocontainer = 
    function(){ 
     var div = this.parent(); 
     var img = this; 
     var imAR = img.attr("height")/img.attr("width"); 
     var bgAR = div.height()/div.width(); 
     if(imAR >= bgAR){ 
      img.attr("width" , div.width()); 
      img.attr("height" , div.width() * imAR); 
     }else{ 
      img.attr("height" , div.height()); 
      img.attr("width" , div.height()/imAR); 
     } 
     div.css({ 
      "overflow" : "hidden" 
     }); 
     img.css({ 
      "left" : (div.width() - img.attr("width"))/2, 
      "top" : (div.height() - img.attr("height"))/2 
     }); 
     img.fadeIn(); 
    }; 

这个CSS：

.layout_container{ 
     width: 100%; 
     overflow: hidden; 
     height: 100%; 
     position: absolute; 
     top: 0; 
     .layout{ 
      width: 103%; 
      height: 100%; 
      position: absolute !important; 
      top: 0; 
      left: 0; 
      z-index: 1; 
      overflow: hidden; 
      min-height: 100%; 
      max-height: 100%; 
      margin-left: -0.5%; 
      .small_box{ 
       width: 32%; 
       overflow: hidden; 
       height: 49%; 
       margin-right: 1%; 
       margin-bottom: 1%; 
       &.large_h{ 
        height: 100%; 
       } 
      } 
      img{ 
       display: none; 
      } 
      iframe{ 
       width: 100%; 
      } 
     } 
    } 

任何想法，我怎么能

要使用同位素和这个脚本，以适应图像到.small_box的div使布局i'm解决这个问题？

Answer 1

这可能是答案ü

http://www.stackoverflow.com/questions/2720310/resize-div-on-browser-resize

Answer 2

添加一个调整大小事件，其中将做数学题在容器上的窗口后，再次被调整浏览器：

var globalResizeTimer = null; 

$(window).resize(function() { 
    if(globalResizeTimer != null) window.clearTimeout(globalResizeTimer); 
    globalResizeTimer = window.setTimeout(function() { 
     $.fittocontainer(); 
    }, 200); 
});