We moved to new unified forum!

Please post all new support queries in our New Forum.

T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
  1. Frits
  2. General Discussion
  3. Monday, 07 March 2016
  4.  Subscribe via email
Hi,

Based on this topic: http://www.t3-framework.org/documentation/menu-system.html I've created a sticky menu bar on top of my pages. Now in the graphic design of the site, the menu bar is only half as wide as the mainbody (on medium and large screens) and partly covering the header image. I solved this by:

Wrapping the container for the navbar in two extra divs, one with the class .row, the other with a few classes like .col-md-6, .col-md-offset-3
Wrapping the mainbody and spotlight containers together in an extra div with relative positioning and a value of top:-50px (so all of the content is moved vertically)

This seems works except from the fact that the wrapper with the mainbody is behaving a bit oddly:

When entering the page, the wrapper is positioned a bit lower than expected;
After scrolling down and returning to the top of the page, there is a short animation, moving the page further up than expected.

You can view this online on a develop site: http://uit01.oorzaak-develop.nl


Hope someone can help me on this one.
Comment
There are no comments made yet.
Accepted Answer Pending Moderation
0
Votes
Undo
Additional info: after trying on the site in my former post I added the sticky menu to another develop site. This time it is without vertical positioning of the mainbody and spotlights. Now I noticed something different: when scrolling down the first 50 pixels or so, the navbar disappears as if it was not fixed. When scrolling further, it appears again and stays fixed at the top of the window. You can see this here: http://www.kvij.nl/jml

This is another kind of animation that puzzles me a bit, because this is not happening on the first site. Also I noticed that, when the page height and the browser window height happen to certain proportions releative to each other, then the navbar is not visible (as when scrolling the first 50 pixels) of even it may be caught in the middle of the animation that brings it back, resulting in an endless repeating flickering. I tried to fix this by giving all pages a minimum height but it is dependent on screen size. On large screens it still occurs.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Hi,

I just check the site and see that there are some wrong markup with the header. I just did some changes in the header in firebug and here is what it looks like: https://nimbus.everhelper.me/client/notes/share/417086/etrrfltl3ninqrt25n7u

Please pm me your site info, I will check again.

Regards.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Gardner Luna,

Thanks for your reply. When viewing your screenshot, it seems to me that you removed my attempt to make the navbar smaller. Removing it may solve the positioning issue, yet I added it intentionally because of the design that we have in mind. Do you think we could achieve a smaller (ie. not covering 100% of the width) navbar while keeping a correct vertical position of the background image?

Also, in my second post I reported a kind of animation effect of the navbar when on an other site. I'd prefer the navbar to stay at the top of the window at any time, without this animation effect. Could you take a look into that as well?

Thanks, Frits
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
We can do that but as it belongs to customization and its out of our support scope, you may need to hire a developer to implement that. The animation will require JS (JAVASCRIPTS). If you need help, I can refer a dev who can help you with that.

Regards.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 4
Accepted Answer Pending Moderation
0
Votes
Undo
Hi,

It seems that we have a misunderstanding. On the develop site http://www.kvij.nl/jml I see some kind of animation effect which I do NOT want. As described in my earlier post:

when scrolling down the first 50 pixels or so, the navbar disappears as if it was not fixed. When scrolling further, it appears again and stays fixed at the top of the window.


It is the moment of re-appearing that suggests some kind of animation. I'd rather have the navbar fixed all the time. Moreover, this effect creates an annoying, continuous flickering when the page happens to have just the height that sets the navbar on the edge of re-appearing: I appears and disappears over and over again.

On this site, I just copied the example from http://www.t3-framework.org/documentation/menu-system.html, I did not make any deliberate changes to it (and I cannot find any accidental changes either).
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 5
Accepted Answer Pending Moderation
0
Votes
Undo
Sorry for the misunderstanding, please pm your site info, I will fix the header mockup to make it work, as mentioned, there are some wrong mockup in the header block.

Regards.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 6
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.