我在我的网站上使用 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”div 高度。
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 : 首先检查每个div的高度
第二:然后检查每个 div 的高度是否小于我的窗口高度。
第三:然后将高度独立地应用到每个 div。
这意味着我的所有“.cartouche_bottom_content”div 都有不同的高度。
事实上,我正试图找到一种方法来使用 foreach 语句,例如在 php 中......
谁能帮我解决这个问题?
非常感谢您的宝贵时间,
最佳答案
如果我没理解错的话,您是在尝试将每个 div 设置为窗口的 View 高度。在那种情况下,如果你觉得舒服的话supporting only modern browsers , 你可以查看 CSS 单元 VH and VW分别为 View Height 和 View Width 设置 div 的宽度和高度。
至于你当前的 JS,我不太确定你试图用你的代码完成什么,如果你试图将每个 div 设置为窗口高度,你就不需要做所有那些复杂的测量并将高度设置为客户端高度?
关于php - 按窗口高度的比例更改多个 div 的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27429687/