Help Needed

[rosco]

Hi all,

I’m developing a Touchscreen mini-site using Twitter Bootstrap and have a small issue that I need your help with.

On the Navigation Bar, the black border underneath the purple gradient disappears behind the gradient when I scroll. How can I amend this so the border scrolls as one?

Here’s the link to the site

Thanks,

Ross

[JosiahB]

find … header#header …. in the css code and change … position: absolute …. to …. position: fixed

Hope this helps!

[JosiahB]

oh, and apply …. z-index: 100; …. to the same element …. header#header …. to make sure that the black border stays on top of the other parts of the page

[rosco]

Hi Josiah,

Thanks for the speedy response, that’s worked perfectly.

I have also noticed that on This Page when you select one of the hyperlinks on the A-Z, and it goes to the anchored link, some of the page is hidden behind the header navbar.

I presume that to fix this I would need to add some padding, but I’m not sure exactly what I need to add the padding to. Can you help?

Thanks,

Ross

[JosiahB]

Hey! Well this is actually a problem with javascript … so find … bootstrap-scrollspy.js … in your javascript folder. Open it up with an editor (notepad will work fine if you have windows) and find …

$.fn.scrollspy.defaults = {
offset: 10
}
…

change … offset: 10 … to … offset: 0 …

Hope this works! :)

[rosco]

Hi Josiah, I tried this but it didn’t work. Any other ideas?

[JosiahB]

ok … then try this ….

$.fn.scrollspy.defaults = {
data-offset=”50″
}

….

[rosco]

Hmm… Sorry that doesn’t seem to work either. Can I check if I’m possibly doing something wrong? I could only find

$.fn.scrollspy.defaults = {

offset: 0

}

I changed this to the code you suggested in the previous post but this hasn’t worked, as the anchored link still disappears behind the navbar (header).

[Author]

Posts