user5245819
user5245819

Reputation:

Selecting elements with jQuery and putting in array to amend css

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

Answers (2)

Decay42
Decay42

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

Rory McCrossan
Rory McCrossan

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

Related Questions