0

我正在尝试制定一个调整大小的函数来增加 div 容器的高度（在每种情况下，这里都是“div.cell”），如果屏幕被挤压得太多以至于内容溢出。每个 div.cell 都有一堆不同的 p。这里只有2个。

    <div class="cell panel">
        <img src="stills/press/press-logo-c2e2.png" class="general"><p class="one">Panelist - Chicago Comic & Entertainment Expo</p>
        <p class="two">[Panel Name Here]</p>
        <p class="three"><b>Panel Date/Location:</b> [Time]PM on April 26-28, 2013 at C2E2 (Chicago, Illinois)</p>
        <p class="three"><b>Panelists:</b> [Panelists]</p>
        <p class="three"><b>Panel Blurb:</b> "[Blurb]"</p>
    </div>

    <div class="cell panel">
        <img src="stills/press/press-logo-wondercon-anaheim.png" class="general"><p class="one">Panelist - WonderCon</p>
        <p class="two">[Panel Name Here]</p>
        <p class="three"><b>Panel Date/Location:</b> [Time]PM on March 29-31, 2013 at WonderCon (Anaheim, California)</p>
        <p class="three"><b>Panelists:</b> [Panelists]</p>
        <p class="three"><b>Panel Blurb:</b> "[Blurb]"</p>
    </div>

在超级初级且非常错误的jquery中，我希望嵌套来做到这一点，例如：

var pheight = 0;
var divheight = 0;
var biggest = 0;
$("div.cell").each(function (){
    divheight=$(this).height();
    pheight = 0;
    $("p").each(function (){
        pheight += $(this).height();
    });
    biggest = divheight;
    if (pheight > biggest) { biggest = pheight };
    $(this).css("height",biggest);
})

这不起作用:)任何人都知道我如何将每个 div.cell 更改为其 p 的累积高度（加上缓冲区）

4

3 回答 3

0

我不确定你到底想要什么。但是你可以试试这段代码：

var pheight = 0;
var divheight = 0;
var biggest = 0;
$(window).resize(function () {
    $("div.cell").each(function () {
        //divheight=$(this).height();
        pheight = 0;
        $(this).find("p,img").each(function () {
            pheight += $(this).height();
        });
        biggest = pheight;
        //if (pheight > biggest) { biggest = pheight };
        $(this).css("height", biggest);
    });
});

这是jsfiddle。http://jsfiddle.net/agAm8/

于 2013-01-30T02:35:44.517 回答
0

试试这个：

$(window).resize(function(){
    //your script here
});

它会将你的函数绑定到窗口调整大小事件，但我认为你的函数不能正常工作，它只会增加高度，而不会降低它。ps：对不起，我不能发表评论。

于 2013-01-30T02:22:10.937 回答
0

根据您的要求，也许这会有所帮助：

var pheight = 0;
var divheight = 0;
var biggest = 0;
$("div.cell").each(function () {
    divheight = $(this).height();
    pheight = 0;
    $(this).children("p").each(function () {
        pheight += $(this).height();
    });
    biggest = divheight;
    if (pheight > biggest) {
        biggest = pheight;
    }
    $(this).css("height", biggest);
});

在这里检查：http: //jsfiddle.net/RLWqV/

于 2013-01-30T02:47:08.747 回答