Jquery高度函数未正确报告内容div的高度

时间:2013-03-02 18:01:25

标签: jquery wordpress dom for-loop

我的wordpress网站宽度是一个侧边栏,客户希望一遍又一遍地重复一组广告以填充空白区域。

所以我有第一组硬编码的广告,然后有一个函数可以获得#content DIV的高度并循环播放一系列广告,并根据需要将它们附加到侧边栏。

它适用于网站的大多数网页,such as here (link)

但由于某种原因,基于一个模板的页面没有报告正确的高度(我将一个跟踪语句放到页面上,它报告~2500而不是~6000)。您可以在pages like this (link)上看到。

为了使调试变得更加困难,它会间歇性地在这些页面上运行。但通常重新加载然后再次失败。循环工作,只是没有足够的时间,因为高度被错误地报告给脚本。我不明白。

脚本在这里:

<script type="text/javascript">
$(function() {
    var contentHeight = $('#content').height();
    var adList = [
        '<a href="http://www.toveromarks.com"><img class="ad" src="http://happeninginthehills.com/wp-content/uploads/ads/ToveroHappeningHills.jpg" /></a>',
        '<img class="ad" src="http://happeninginthehills.com/wp-content/uploads/2012/12/vi-owens-ad.png" />', 
        '<a href="http://www.hadunne.com"><img class="ad" src="http://happeninginthehills.com/wp-content/uploads/2012/12/susie-ad1.png" /></a>', 
        '<a href="http://www.deborahchabrian.com"><img class="ad" src="http://happeninginthehills.com/wp-content/uploads/ads/chabrian-ad.jpg" /></a>',
        '<a href="http://www.tclaw.biz"><img class="ad" src="http://happeninginthehills.com/wp-content/uploads/2012/12/jeffs-ad.png" /></a>',
        '<a href="http://www.edmartinezart.com"><img class="ad" src="http://happeninginthehills.com/wp-content/uploads/ads/martinez-ad.jpg" /></a>',
        '<img class="ad" src="http://happeninginthehills.com/wp-content/uploads/2012/12/scott-phillips-ad.jpg" />'
        ];
    var adHeight = 285;
    var numRequiredAds = adList.length;
    var heightDiff = contentHeight - (numRequiredAds * adHeight);
    var numAds = Math.floor(heightDiff/adHeight);
    if (heightDiff > adHeight){
        for (var i = 0; i < numAds ; i++) {
            $('#primary').append(adList[i % adList.length]);
            //$('#primary').append('<p>ad num '+i+'</p>');
        };
            //$('#primary').append('<p>height is'+contentHeight+'</p>');
        }
   });
  </script> 

1 个答案:

答案 0 :(得分:0)

window.onload = function() {
   // your code
}