Shrinking Header

Hi everyone,

I have a shrinking header banner on my home page which works well on scrolling down but not up, the smaller header banner shows on the other pages. The problem I have is if the home page is clicked on the menu from another page the home page shows both banners (large and small).
Have I missed some coding in what I’ve entered below

$w.onReady( function () {
// TODO: write your page related code here…
});
export function largeStrip_viewportLeave(event) {
// Add your code for this event here:
$w( ‘#smallStrip’ ).show( “fade” );
$w( ‘#image11’ ).show();
$w( ‘#horizontalMenu1’ ).show();
$w( “#largeStrip” ).hide();
$w( “#image9” ).hide();
$w( “#horizontalMenu3” ).hide();
}
export function smallstrip_viewportEnter(event)
{
$w( “#smallStrip” ).hide();
$w( “#image11” ).hide();
$w( “#horizontalMenu1” ).hide();
$w( “#largeStrip” ).show();
$w( “#image9” ).show();
$w( “#horizontalMenu3” ).show();
$w( “#text14” ).show();
}

Image of home page -

Help with this issue greatly received :crossed_fingers: