6

我在设置动态加载的元素的高度时遇到了一些麻烦。

我使用jqueryload将外部(动态)页面加载到当前页面上的 div(#cbox)中的函数。因为这个子页面是动态的,所以我事先无法知道内容的高度是多少。我想在加载内容后获取高度并将容器 div 的高度设置为匹配,以便我的颜色背景 css 一直向下。我只在 css 中尝试了许多 100% 高度 div 的变体,但是一旦我滚动页面,颜色就会向上滚动(100% 似乎只设置了浏览器窗口高度的 100%,并且 b/c 内容是动态的加载它不起作用。我的解决方案是将 div 的高度设置为加载内容的高度,但这仅适用于第二次单击(因为此时页面已加载并可访问。我需要弄清楚怎么做是在外部页面已经加载后更改 div 的高度,

我希望这对某人来说是可以理解的,我意识到这有点令人费解。

这是我的点击代码:

jQuery('#cbox').load('externalpage.php');
jQuery('#cbox').height(jQuery('#content').height());

更新:如果我想将高度设置为该 div,则以下解决方案有效。但是现在我发现如果内容高度比窗口高,我只想将它设置为那个 div 高度。否则我希望它设置为 100%。我尝试将他们的代码稍微修改为此(onlick 事件):

jQuery('#cbox').load('<?php the_permalink(); ?>', function() 
   { 
      if (jQuery('#cbox').height() < jQuery('#content').height()) 
      {
         jQuery('#cbox').height(jQuery('#content').height()); 
      } 
      else
      { 
         jQuery('#cbox').height('100%'); 
      }
   });

但它不起作用......有什么想法吗?

4

2 回答 2

16

您需要在加载内容后调用回调函数。

jQuery('#cbox').load('externalpage.php', function() {
   jQuery('#cbox').height(jQuery('#content').height());
});
于 2010-08-16T13:59:44.427 回答
4

使用加载回调。

jQuery('#cbox').load('externalpage.php', function() {
  jQuery('#cbox').height(jQuery('#content').height());
});
于 2010-08-16T14:00:25.980 回答