• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2784

Original Genesis Tutorials & 6000+ Guaranteed Code

Snippets

  • Consultation
  • Full Access
  • Log in

Using jQuery To Change Height At Any Screen Width

These jQuery code snippets enable you to control the height of a div or the height of a background image at any screen width.

The following video shows what the use of the code snippets on this page enable you to do :

In this example, the height is changed to 400px at screen widths less than 960px. Tested using the Atmosphere Pro child theme by StudioPress however should work fine using any Genesis child theme.

This solution will work with any existing jQuery including tutorials which use backstretch that adds inline CSS and tutorials which use pure CSS or a combination of both.

Tested by adding one of the following jQuery examples to the existing jQuery file in this tutorial for a registered user.

Register or login to access the jQuery snippets :

Register for full access

Related Tutorials

  • Change Height of Image Using jQuery
  • Responsive Image After Header On Single Pages in Genesis

Atmosphere Pro Theme

Reader Interactions

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

Code written by Brad Dalton specialist for Genesis, WooCommerce & WordPress theme customization. Read More…

Advertise · WPEngine · Genesis · Log in

  • Access Problems
  • Account Details
  • Consulting
  • Tags
 

Loading Comments...
 

You must be logged in to post a comment.