Fixed Header, Scroll Content (without moving under header)

[mabrams]

Hello,

I am currently working on a project, using superscrollorama (http://johnpolacek.github.io/superscrollorama/). I have a fixed header with a navigation bar which I want to use the scroll code:

var elemOffset = $("#elemID").offset().top;
TweenLite.to($(#elemID"), 1, {scrollTo:elemOffset});

The problem I am having is I am using the superscrollorama ‘pin’ function, but when I do this the scroll location of the animation is always different, causing the above scroll code to break.

If there is a way to keep the content div in place while scrolling without moving behind and above the fixed header, this would solve the issue. Any ideas?

http://jsfiddle.net/dkcmH/

Thanks,

Michael Abrams

[Paulie_D]

So you want to scroll…but you don’t want the content to move…is that it?

That sounds illogical…if the content isn’t moving…what are you actually expecting to scroll

[mabrams]

I want to scroll the content, but without moving the div’s container above, but keep it contained from the height of the header. I know it sounds illogical, however I haven’t found an example of people using top fixed navigation combined with superscrollorama, is probably the reason why.

[Paulie_D]

I want to scroll the content, but without moving the div’s container above, but keep it contained from the height of the header.

So it sounds like you need an wrapper of some sort.

Frankly, I can’t quite picture what this will look like or how it would operate.

[mabrams]

This was exactly what I was thinking. However, I found that just starting my blocks from the top of the page (rather than trying to make it happen below the header), allowed my scroll script to work.

[Author]

Posts