Question

我有自己的wordpress侧边栏中显示的项目。我们说div1，div2，div3。

我的客户希望重复侧边栏中的项目序列，以填充侧边栏的高度以匹配主要内容区域的高度。因此，如果每个div的高度为200px，并且给定页面上主div中的内容为1000px，那么应该有div1，div2，div3，div1，div2。

我知道如何编写php并编写循环，但是如何知道要运行多少循环？

虽然我认为这有点傻，但我的客户坚持这一点。

Answer 1

我想到的一个解决方案是，使用JavaScript（或JQuery）来获取主要内容的高度，并确定可以在侧面添加多少DIV。

编辑：这不是一种有效的方法，但在循环中假设将显示所有侧栏内容。然后，在javascript中决定要显示多少个div。

Answer 2

这种效果被称为“浮动侧边栏”。我们将提供多种wordpress插件。

简单的Google搜索会找到解决问题的方法。

谷歌搜索结果之一是：

http://www.strx.it/2010/11/wordpress-floating-sidebar-plugin/

Answer 3

我用jQuery做了这件事。它不是一个浮动的侧边栏，它实际上根据需要添加了img标签，直到不再合适为止。

<script type="text/javascript">
$(function() {
    var contentHeight = $('#content').height();
    var adList = [
        '<img class="ad" src="----url to first ad -----" />', 
        '<img class="ad" src="----url to second ad -----" />', 
        '<img class="ad" src="----url to third ad -----" />', 
        '<img class="ad" src="----url to fourth ad -----" />', 
        '<img class="ad" src="----url to fifth ad -----" />'
        ];
    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]);
        };
    }

});

根据主要内容的高度重复wordpress中的侧边栏项目？

3 个答案: