Joomla Templates Club 406,261 posts

[darengr Friend darengrJoin date: January 2012Posts: 108Downloads:112Uploads:30 Thanks: 4 Thanked: 1 times in 1 posts]

#882370

Hi,
in your demo, the header appears transparent at the top of the page. When we scroll down, at some point it decides to get the affix class, and appears solid.
The question is, what is the mechanism (code or css?) that decides at which vertical scrolling point to show the second header (solid), because in some pages the solid should be shown earlier.
thanks

---

Attachments:

1. 
2. 

[timtecsa Friend timtecsaJoin date: October 2009Posts: 1382Downloads:86Uploads:327 Thanks: 197 Thanked: 132 times in 34 posts]

#882670

I agree. The moment the masthead is out of site would be good.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#883977

Hi

It’s Affix plugin of Bootstrap: http://getbootstrap.com/javascript/#affix

For how we add affix to the header of this template, you can check the JS file: ROOT/templates/ja_mono/js/script.js

Look for this snippet of code (line 140):

    // Add Affix for header
    $heightHeader = $('.t3-header').outerHeight();
    $heightBlocktop = $('.block-left').outerHeight() - ($('.t3-header').outerHeight() * 1.5);
    $('.t3-header').affix({
      offset: {
        top: $heightBlocktop,
      }
    })

................

[darengr Friend darengrJoin date: January 2012Posts: 108Downloads:112Uploads:30 Thanks: 4 Thanked: 1 times in 1 posts]

#885622

Thanks for reply. It seems a value, based on t3-header outerheight * 1.5, so it very difficult to use, if it is always the same. Various pages have either masthead images displayed (of varying height probably), or other text or images, so I think I will use a solid-fixed header. regards

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#885959

Let me know if you need further help.

[Author]

Posts