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

WP SITES

2785

Original Genesis & WooCommerce Tutorials & 6000+ Guaranteed Code

Snippets

  • Try Premium
  • Log in

Toggle Push Down Banners From Big To Small

This code enables you to display 2 banners which you can toggle from big to small. In this example, both banners are the same width 1120px however the big banner is 772px in height and the small banner is 320px.

You can use any width or height you like as long as the width is the same for each banner image.

Here’s the demo video which reveals all.

Demo Video

Shows you how the banner can be toggled from big to small. By default, its coded to open with the larger banner.

Tested using the Genesis Sample child theme by StudioPress.

Code Installation

After downloading the zip folder below, follow these installation instructions.

There’s 4 simple steps :

Step 1 : Upload the pushdown.js file to your child themes root directory.

Step 2 : Copy & paste the PHP code from functions.php to the end of your child themes functions.php file.

Step 3 : Copy & paste the CSS from style.css to the end of your child themes style.css file.

Step 4 : Copy over the images from the images folder to your child themes images folder.

Clear caching especially if using Chrome.

Here’s the download zip folder for logged in members:

Register for full access

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