Jquery .css 没有将高度属性应用于 div答案

【问题标题】：Jquery .css not applying height property to a divJquery .css 没有将高度属性应用于 div
【发布时间】：2012-02-21 05:08:40
【问题描述】：

我正在开发一个网站，对 jquery 来说还算新。出于某种原因，当我在一个 div 上使用 .css() 函数时，它不会改变高度。它适用于另一个 div，但不适用于这个。这是网站的链接：

http://dev.djrefine.com/epic/index111.html

要激活相关功能，请通过单击灰色框打开任何文章，然后单击右上角的白色“关闭”框。

并且有问题的代码在第 506 行，这是这个 sn-p 中的第六行：

        var $wWidth = $(window).width();
        var $wHeight = $(window).height();

        var $newheight = Math.round($wHeight * 0.8 - 200) + 'px';

        $('#container').css('height',$newheight);

        $('#theThing').html($newheight);
        $('#thisThing').html($('#container').css('height'));

        $('#makeMeScrollable').css({'height':$wHeight * 0.8 - 200,'width':$wWidth - 260});

div #makeMeScrollable 正确调整了它的 css，但 #container div 没有。

div #theThing 和 #thisThing 只是显示 $newheight 是正确的数字，但容器高度并未设置为等于该数字，正如您在演示页面中看到的那样

我还尝试让 $newheight 不四舍五入，不在末尾添加“px”，以及我能想到的所有其他变体......

【问题讨论】：

尝试在 Chrome 中调试，似乎按预期工作。你用的是哪个浏览器？
您是否尝试过使用.height() 和.width() 方法来代替.css()？另外，这里没有加载 jquery-scrolltofixed-min.js（404 响应代码）
我在所有 5 种主要浏览器中都进行了尝试，并且在所有浏览器中都获得了相同的结果。jquery-scrolltofixed-min.js 没有用于任何当前脚本，它是用于其他用途...我会删除那行
单击“关闭”后，请查看搜索栏下方的左侧。应该有两个数字，顶部是变量，第二行是#container 高度的实际值。我的一个显示 650，另一个显示 2936，尽管它们应该是相同的，对吗？

标签： jquery css height

【解决方案1】：

找到了解决办法..

    setTimeout(function(){
        $('#container').css('height',$newheight);
        $('#thisThing').html($('#container').css('height'));
        $container.isotope( 'reloadItems' ).isotope({ sortBy: 'original-order' });
        $container.isotope( 'reLayout' );
        }, 0);

感谢 Alex Sexton 在这篇文章中的回答：

recalculate element height in jQuery after class change

它基本上会在超时 0 秒内延迟内容，但是让它在那里迫使他们等到函数的其余部分完成。我不知道为什么它是必要的，但它有效。

【讨论】：

花了一个小时试图解决这个问题，这个答案解决了我的问题！非常感谢！