在 chrome 中完成检查元素后，Jquery 工作

Question

网站链接:

[http://50.87.144.37/~projtest/team/design/Cece/][1]

Jquery:

$(document).ready(function () {
    var pgHeight = $(window).height();
    //alert(pgHeight);
    $('.sitewid').css('min-height', pgHeight - 150)
    var ltHeight = $('.mainImg').height();
    $('.left').css('height', ltHeight);
    $('.links').css('height', ltHeight);
    var dHeight1 = $('.mainImg').height();

});

$(window).resize(function () {
    setTimeout(function () {
        var lt1Height = $('.mainImg').height();
        //alert(lt1Height);
        $('.left').css('height', lt1Height);
        $('.right').css('height', lt1Height);
        $('.links').css('height', lt1Height);
        $('.social').css('top', lt1Height / 2.8);
    }, 50);
});

HTML:

<div id="container">
   <div class="sitewid">
      <div id="header">...</div>
      <div id="content" class="mainPg">
         <img class="mainImg" src="images/bnw.jpg" alt=" ">
         <div class="left">...</div>
         <div class="right mainRHeight">...</div>
         <p class="cls"></p>
      </div>
      <div id="footer">...</div>
   </div>
</div>

这是一个响应式设计。该页面在 Firefox 中运行良好，但在 Chrome 和其他 webkit 浏览器中查看时，jquery 无法正常工作。类“mainImg”将是一个动态图像。所以 .left 和 .right 正在获取它的高度，并且该高度被分配给两个部分。当我检查 chrome 中的元素或双击 ipad 屏幕时，内容进入所需位置，但在页面首次加载时以随意方式显示。我在这里做错了什么？脚本语法在 head 标签中。我自己学过 jQuery，所以我确定我在这里遗漏了一些东西，因为在这个元素之前我也遇到过这个问题。 :/

Answer 1

这样试试，

$(document).ready(function () {
var pgHeight = $(window).height();
//alert(pgHeight);
$('.sitewid').css('min-height', pgHeight - 150)
var ltHeight = $('.mainImg').height();
$('.left').css('height', ltHeight);
$('.links').css('height', ltHeight);
var dHeight1 = $('.mainImg').height();
resizeWindow();
});

$(window).resize(function () {
setTimeout(resizeWindow, 50);
});

function resizeWindow() {
    var lt1Height = $('.mainImg').height();
    //alert(lt1Height);
    $('.left').css('height', lt1Height);
    $('.right').css('height', lt1Height);
    $('.links').css('height', lt1Height);
    $('.social').css('top', lt1Height / 2.8);
}