Hello

Could you try adding the following to the Custom CSS field of your templates parameters where 160px is the new height of your header area...

#container_header, .header_bar {

    height: 160px;

}

Ciarán

Thank you - this worked well, however I now note that one other feature is out of kilter.

Tha menu that lives below this header bar... it usually stops at the bottom of the header bar when the header bar reaches the top of the page.

Since I have changed the size (to 230px) it now stops about half way up the header bar.

Are you able to offer the correction for this?

Try editing the following in your templates scripts.php (../templates/j51_lifestyle/php/scripts.php)..

<!-- Sticky Div -->

<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/jquery.sticky.js" charset="utf-8"></script>

<script type="text/javascript" >

  jQuery(window).load(function(){

    jQuery("#container_hornav").sticky({ topSpacing: 122 });

  });

  jQuery(window).load(function(){

    jQuery("#container_header").sticky({ topSpacing: 0 });

  });

</script>

You will have to edit the 122 to I think 232!

Hope this helps!

Ciarán

Thank you! This is perfect.

I would now like to change things round just a little (since the header bar is now so large) so that the header bar continues to scroll but the menu bar stops at the top of the page... is this doable?

Thank you
Stephan

Hi Stephen

Try changing the above scripts.php code to the following...

<!-- Sticky Div -->

<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/jquery.sticky.js" charset="utf-8"></script>

<script type="text/javascript" >

  jQuery(window).load(function(){

    jQuery("#container_hornav").sticky({ topSpacing: 0 });

  });

</script>

Ciarán