1

I have a layout where I need each child div in two columns to have a minimum height equivalent to the height of the window. To do this, I use:

$('.element').css("min-height",$(window).height());

This works for my purposes, however I wish to apply this to a number of elements, as aforementioned.
I used an array to attempt to achieve this:

var length = [$('.first'), $('.second'), $('.third'), $('.fourth'), $('.one'), $('.two'), $('.three'), $('.four')];
length.css("min-height",$(window).height());

As I am only new at javascript, I am unsure if it is even possible to select elements in this manner. Any help would be appreciated.
Here is a jsfiddle.

Improve this question
0

2 Answers 2

Reset to default
1

Instead of supplying multiple selectors, you could as well add a new class to all elements that need to be modified.

For example, add class="adjust-min-height" and then use

$('.adjust-min-height').css("min-height", $(window).height());

edit:

If you want to use an array similar to what you asked for in your question, you could do this:

var elements = ['.first', '.second', '#maybe-an-id', '.third'];
var selector = elements.join(', ');
$(selector).css('min-height', $(window).height());

You can of course put the .join(', ') after the array, I just split it up for clarity.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

When supplying multiple selectors, separate them by a comma:

$('.first, .second, .third, .fourth, .one, .two, .three, .four').css("min-height", $(window).height());

However the above code completely misses the point of classes; you should put a single class on all the above elements and use one selector only - exactly as your first example does.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.