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.
Was This Tutorial Helpful?