How to make my menu "sticky" - Page 5

User 2699991 Photo


Registered User
3,125 posts
Online Now

You should have got an email to the link

The Help You Need: When You Need It The Most
Website Design & Development
Website Renovations
Wayans' Theme Park
Watch Listen & Learn Video Tutorials
User 2140875 Photo


Registered User
343 posts

Thanks. Received video. Definitely working on your side although there was one point that I saw a screen similar to the screenshot I sent you. You clicked the refresh button and it went away.

I sent you the cssSlider files in Dropbox. The file named "code pasted into html element" contains the 2 step instructions required to put the slider on the website, once the slider is published to local computer.

I noticed you had a google chrome extension that allows you to go to certain preset screen sizes. Mind sharing the name of that extension.

Thanks!
User 2140875 Photo


Registered User
343 posts

Inger wrote:

I see the problem you're having. I haven't studied the menu, but it seems to me that it is indeed sticky but the slideshow goes on top of it. Try to give the 'hero-column' a negative z-index, as I explained earlier.


Wayan,
I republished the site to be sure I got all the necessary files uploaded. I think Inger is correct. I didn't notice before but I think the menu is actually sticky, but the slider is moving above the navbar rather than under it.
https://galenswebsite.com/rr/

I'll see if I can adjust the z-index as he suggests.

Thanks.
User 2699991 Photo


Registered User
3,125 posts
Online Now

Galen Garretson wrote:
Inger wrote:

I see the problem you're having. I haven't studied the menu, but it seems to me that it is indeed sticky but the slideshow goes on top of it. Try to give the 'hero-column' a negative z-index, as I explained earlier.


Wayan,
I republished the site to be sure I got all the necessary files uploaded. I think Inger is correct. I didn't notice before but I think the menu is actually sticky, but the slider is moving above the navbar rather than under it.
https://galenswebsite.com/rr/

I'll see if I can adjust the z-index as he suggests.

Thanks.


He is a she

and it wont hurt to do z index but I have it here working without messing about with the slider stuff

The Help You Need: When You Need It The Most
Website Design & Development
Website Renovations
Wayans' Theme Park
Watch Listen & Learn Video Tutorials
User 2699991 Photo


Registered User
3,125 posts
Online Now

give the row for the sticky thingy the z index 100 (don't know where Inger gets it doesn't work with sticky from)

check it out at
https://tester.sdv3tutorials.com

By the way you have spelt TESTIMONIALS wrong, ( you have TESTAMONIALS), unless thats how you spell it wherever in the world you are

The Help You Need: When You Need It The Most
Website Design & Development
Website Renovations
Wayans' Theme Park
Watch Listen & Learn Video Tutorials
User 244626 Photo


Registered User
807 posts

Wayan Jaya wrote:
give the row for the sticky thingy the z index 100 (don't know where Inger gets it doesn't work with sticky from)

check it out at
https://tester.sdv3tutorials.com

By the way you have spelt TESTIMONIALS wrong, ( you have TESTAMONIALS), unless thats how you spell it wherever in the world you are


That's working better but on my iPhone the slider still goes on top. I think my testing shows it just needs on the sticky thingy row at least a setting of 2 for mobile and desktop....but 100 probably a good idea.....just adjust it on mobile too and see if that fixes it Wayan.


.csslider1 > ul {
position: relative;
z-index: 1;
font-size: 0;
line-height: 0;
margin: 0 auto;
padding: 0;

overflow: hidden;
white-space: nowrap;
}


Thats the cssslider code thats causing the issue as Waylan is targeting......
I don't design the sites, I make them work.
User 2699991 Photo


Registered User
3,125 posts
Online Now

Twinstream wrote:
Wayan Jaya wrote:
give the row for the sticky thingy the z index 100 (don't know where Inger gets it doesn't work with sticky from)

check it out at
https://tester.sdv3tutorials.com

By the way you have spelt TESTIMONIALS wrong, ( you have TESTAMONIALS), unless thats how you spell it wherever in the world you are


That's working better but on my iPhone the slider still goes on top. I think my testing shows it just needs on the sticky thingy row at least a setting of 2 for mobile and desktop....but 100 probably a good idea.....just adjust it on mobile too and see if that fixes it Wayan.


.csslider1 > ul {
position: relative;
z-index: 1;
font-size: 0;
line-height: 0;
margin: 0 auto;
padding: 0;

overflow: hidden;
white-space: nowrap;
}


Thats the cssslider code thats causing the issue as Waylan is targeting......


try again

Thanks Twinstream (forgot to put z index on mobile)

The Help You Need: When You Need It The Most
Website Design & Development
Website Renovations
Wayans' Theme Park
Watch Listen & Learn Video Tutorials
User 244626 Photo


Registered User
807 posts

No Problem Wayan, good find !
I don't design the sites, I make them work.
User 2140875 Photo


Registered User
343 posts

Thank you. Seems to be working now. Really appreciate your time and help. I need to put some time in to see how you did your magic!!
User 2140875 Photo


Registered User
343 posts

Wayan,
One last little thing. At view port 1023 the menu changes to hamburger and is great. At 1024 it goes back to desktop view, however the menu items are not automatically resizing. I've attached a screenshot. Once I get out to about 1200 they are all view-able. Hope this just a little thing. I don't want to go in there and mess up all the work you have already done.

At some point I will be able to do this on my own thanks to all the help I have received here.
Attachments:

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.