1

I have a site with always fixed header and try to use jQuery Scrollify plugin. It works well, but fixed header overlap content. So after every section scrolling part of this section is overlapped. Scrollify have option 'offset', but it not helps. I think it needs to be something like 'negative offset' to make indent from top. For example: -100 etc.

Maybe somebady had issue with this?

1
  • try applying scroll for body content only instead of whole window Commented Aug 9, 2016 at 10:25

3 Answers 3

1

To stop overlapping of content, we can do something like this:

var $headerHeight = $('.header').height();
$('.header + *').css('top', ($headerHeight));
$('.header + *').css('position', 'relative');

We can set top position or top margin to next element of header.

Sign up to request clarification or add additional context in comments.

Comments

0

Ok. I use 'offset: -100' and it works :)

Ofcource I have page scrolled down for 100px, so this is not full decision, but it helps.

Comments

0

My suggestion would be to have an inner wrapper within your sections that wraps your content. You could use that to better control the position of your content within the sections to make sure they are clear of the header.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.