Atmosphere Pro Set Height of Front Page 1 Image

The front page 1 background image size is set in the atmosphere-pro > js > front-page.js file using the following jQuery located between lines 12 – 22 :

// Set front page 1 height.
var windowHeight = $( window ).height() - 77;

$( '.front-page-1' ) .css({'height': windowHeight +'px'});

$( window ).resize(function(){

var windowHeight = $( window ).height();

$( '.front-page-1' ) .css({'height': windowHeight +'px'});

});

To set the height of this image you’ll need to remove the above code from the file and replace with the following & ( clear caching ) :

$( '.front-page-1' ).height(400);

Here’s what the code in the file should look like after the modification.

The code modification will produce something like you see in the following result :

From the default which looks like this :

Demo Video

Shows how to modify the jQuery to change the height of the front page 1 background image.

Uses the jQuery .height(); method to set the height of the front-page-1 element.

Related Tutorials

• Using jQuery To Change Height At Any Screen Width