Question

我在我的网站上使用jquery循环播放幻灯片。我的所有幻灯片都包含一个名为“cartouche_bottom_inside”的div，我需要将每个div调整到窗口的高度。我的幻灯片是通过php生成的，所以如果有这种结构，那么基本上是：

<div id="slideshow">

    <div class="slide">

        <div class="cartouche_bottom_inside">

        /* my content */

        </div>

    </div>

    <div class="slide">

        <div class="cartouche_bottom_inside">

        /* my content */

        </div>

    </div>


        <div class="cartouche_bottom_inside">

        /* my content */

        </div>

    </div>

    <div class="slide">

        <div class="cartouche_bottom_inside">

        /* my content */

        </div>

    </div>

</div>

使用这个jquery代码我可以根据各种自定义变量更改“cartouche_bottom_inside”divs高度。

function margin_bottom_cartouche(){

    var cartouche_bottom_inside_H = $(".cartouche_bottom_content").height();
    var margin_bottom_cartouche_add = windowH - cartouche_bottom_inside_H - cartouche_top_visible_H;

        if (cartouche_bottom_inside_H < windowH) {

            $(".cartouche_bottom_content").css("height",cartouche_bottom_inside_H + margin_bottom_cartouche_add -cartouche_top_visible_H);
        }       
}

它有效，但是第一，在我的if语句中，$（“。cartouche_bottom_content”）。height（）获取我所有“cartouche_bottom_inside”div的总和。

然后它将$（“。cartouche_bottom_content”）。height应用于我的所有div（取决于最高的“.cartouche_bottom_content”div。

我要做的是：

1st：首先检查每个divs身高

第二：如果高度小于我的窗户高度，则检查每个div。

第3：然后独立地将高度应用于每个div。

这意味着我对所有“.cartouche_bottom_content”div都有不同的高度。

实际上我正试图找到一种方法来获得一个foreach语句，例如在php中......

任何人都可以帮我这个吗？

非常感谢你的时间，

Answer 1

如果我正确理解您，您可以尝试将每个div设置为窗口的视图高度。在这种情况下，如果你感到舒服supporting only modern browsers，你可以分别查看CSS单位VH and VW的视图高度和视图宽度来设置你的div的宽度和高度。

至于你现在的JS，我不太确定你要用你的代码完成什么，如果你试图将每个div设置为窗口高度，你就不需要了做所有那些复杂的测量，只需将高度设置为客户端高度？

按窗口高度的比例改变多个div的高度

1 个答案: