Joomla Templates Club 406,261 posts

[Ch1vpH Friend Ch1vpHJoin date: February 2016Posts: 299Downloads:21Uploads:128 Thanks: 29 Thanked: 1 times in 1 posts]

#1043992

Hi there,

Is there any way to have the top nav-bar menu ‘sticky’ so it moves down with the page as you scroll??

Please advise,

Ps; desperately need this option…as I can’t really hire a developer re; my ‘side menu’ post

site: http://ch1vph.xyz/ri2k

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1045153

Hi
Try this
add below code in custom.css file

@media (min-width: 992px)
{
body.header-horizontal .t3-header {
    padding-left: 96px;
    padding-right: 96px;
    z-index: 9999;
    width: 100%;
    position: fixed;
    background: #ffffff;
}

body.header-horizontal .t3-mast-head {
    position: relative;
    padding-top: 240px;
}
}

It work for large screen size only becuase of the header height is too long and it hide your content.

Regards

1 user says Thank You to Pankaj Sharma for this useful post

1. Ch1vpH

[Ch1vpH Friend Ch1vpHJoin date: February 2016Posts: 299Downloads:21Uploads:128 Thanks: 29 Thanked: 1 times in 1 posts]

#1045798

Hi that works perfectly thanks!

Can you tell me if its possible to have a thin or thick border on the sticky menu!?

See image for example…

Thanks

---

Attachments:

1. 

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1045847

You are welcome!
Please open a new thread for a new topic question. It also helps other users to find same topic.

Regards

[Ch1vpH Friend Ch1vpHJoin date: February 2016Posts: 299Downloads:21Uploads:128 Thanks: 29 Thanked: 1 times in 1 posts]

#1046076

Ok I did a new topic, could you also you tell me if the sticky menu can be used on individual pages…

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1046151

Hi
You can apply the code I suggested and use the page class option for a different menu, to apply the different style code for each menu item.

Regards

[Ch1vpH Friend Ch1vpHJoin date: February 2016Posts: 299Downloads:21Uploads:128 Thanks: 29 Thanked: 1 times in 1 posts]

#1048807

Hi there,

So my I’ve noticed that the sticky menu (although it looks great) its cutting the size of the pages a by a quarter, because of this it is hard to view pages in full.

Could you please let me know if there’s any way to compress this when scrolling or if theres a possibility to have just the menu area (see pic) move with the page and you only see the logo whilst at the top of page??

Please let me know possibles!

Thanks

New Site: https://ri2k.london

---

Attachments:

1. 

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1048924

Hi
I noticed you already fixed this with adding padding-top value style in the custom.css
http://prntscr.com/fwj36z
Please confirm.

Regards

[Ch1vpH Friend Ch1vpHJoin date: February 2016Posts: 299Downloads:21Uploads:128 Thanks: 29 Thanked: 1 times in 1 posts]

#1050654

Hi there,

No I believe that padding was to just to keep the logo and menus ‘pink border’ consistent with my large screen views!

Let me know your thoughts on the possibilities of just moving the menu and not the logo…because if you view on an iPad at present the sticky menu takes up a third of the screen!

Thankyou

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1050882

Hi
When the screen size is smaller there is not enough width to get all in the same view, So it comes down in down the line and shows you like this.

Regards

[Ch1vpH Friend Ch1vpHJoin date: February 2016Posts: 299Downloads:21Uploads:128 Thanks: 29 Thanked: 1 times in 1 posts]

#1051164

Hi there,

Sorry I’m unsure what you meant by your last post…but if I could just explain what I’m after again with a couple screenshots depicting exactly what I want to do. Its basically so my customers can see more of the page without having the main logo scroll down with the page and have just the menus scroll with the page instead…

Thanks

• This reply was modified 7 years, 5 months ago by  Ch1vpH.

---

Attachments:

1. 
2. 

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1051200

Hi
Do you want to remove the logo from site?

Regards

[Author]

Posts