Implement the same floating sticky menu that you yourselves use

gribblej

I am writing again for help with implementing this in Ja Company. I want to use the exact same system which you use on the Joomlart site and the Gavick Pro site. It is JS based and works in Microsoft browsers. I have not gotten the simple, clear step-by-step tutorial for which I fervently hope. As a customer I want to be able to obtain the same functionalities you demonstrate on your company websites. The prior thread I started on this was dropped, without resolution, so I am starting it again. I am two weeks into my quest for an answer.
Step 1. What exactly is the script I need?
Step. 2. Where exactly does it go?
Step. 3. How exactly do I publish/enact it?
Step. 4. Is there a way that doesn't require compiling to LESS? Many bad things can happen.
Step. 5. Exactly what corresponding CSS changes need to be made to the mainnav section of template.css?
I do hope someone from Joomlart will fill in the above steps. I hope it can then be added to the template documentation. You obviously know how popular this has become because you yourselves use it on your own business websites. We customers would appreciate having easy access to it also.
Many thanks to anyone out there who can assist,
-Jim G.

Ninja

gribblej

Hi
open Template folder /tpls/blocks/mainnav.php file
Find

<nav id="t3-mainnav" class="wrap navbar navbar-default t3-mainnav">

Replace it with

<nav id="t3-mainnav" class="wrap navbar navbar-default t3-mainnav" data-spy="affix" data-offset-top="150">

Now open /css/custom.css file and add this code

.t3-mainnav.affix {   position: fixed;   top: 32px;   left: 0;  width: 100%; z-index: 999;   }

Save file , clear cache and check.
it will work on all browsers.

Regards

gribblej

Thank you for this elegant clarity. And there is no need to compile to LESS (as other posts have hinted)?
-Jim G.
I will try it in the morning, getting very late here.

Ninja

gribblej
Hi
There is no need to to compile less to css as its custom.css file.
To avoid override on template updates
kindly place mainnav.php as following path

Template folder local/tpls/blocks/mainnav.php file

gribblej

That's right, yes, I always use custom.css. I guess now I understand why some people were thinking to compile; that would put the changes into template.css. But if you're using custom.css, you can just stash the new code there and it will override everything.
So now I think I finally "get it."
Thank you.