Reputation:
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.
Upvotes: 1
Views: 27
Reputation: 872
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.
Upvotes: 1
Reputation: 337656
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.
Upvotes: 0