canacast
canacast

Reputation: 241

Adding variable heights with multiplier in jQuery

The following code does what it should perfectly, however I need to add 30% more height to the containing element .boxy on top of the added variable heights.

I've tried searching for ways to add a percentage to the equation, but so far I've just found vague answers or non-applicable methodologies.

$(".exPand a").click(function (event) {
    event.preventDefault();
    var postHeight = $(this).closest('.boxy').find('.articleImageThumb').height();
    var excHeight = $(this).closest('.boxy').find('.initialPostLoad').height();

    $(this).closest('.boxy').animate({height: postHeight+excHeight}, 1000);
});

Live output:

<div class="boxy">

    <div class="boxGrad"></div>

    <div class="postmetadata"></div>

    <div class="articleTitle"></div>

    <div class="rightCtrls"></div>

    <div class="ajaxBoxLoadSource"></div>

    <div class="articleImageThumb"></div>

    <div class="initialPostLoad"></div>

</div>

Upvotes: 0

Views: 165

Answers (1)

James Montagne
James Montagne

Reputation: 78690

Just multiply by 1.3

$(this).closest('.boxy').animate({height: (postHeight * 1.3)+excHeight}, 1000);

Move the * 1.3 to the appropriate place depending on which height you want 30% of.

Upvotes: 3

Related Questions