Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Posted by deon lieberum
deon lieberum
30 Points

Play Store Header (Android)

How do I create a header (Like the Play Store on Android) that fades in as I scroll down on my website?

2 Answers

Craig Watson
Craig Watson
27,930 Points
Craig Watson
Craig Watson
27,930 Points

Hi Deon,

I you looking to do this on a webpage/ website or on an ios/andriod app ??

Also are you familiar with JQuery ?

I think I know what knid of menu you you are talking about its similar to that of Twitter where when you scroll down the nav becomes fixed to the top of the page and the content scrolls underneath is this correct?

Craig

deon lieberum
deon lieberum
30 Points
deon lieberum
deon lieberum
30 Points

I'm not familiar with JQuery... The header is invisible until you scroll down the page. As you start to scroll the header fades in from 0%-100% opacity and then stays there. When scrolling back to the top it fades out again in the same fashion.

Craig Watson
Craig Watson
27,930 Points

No Problem,

This would require some JavaScript or jQuery to achieve in the best possible way having it fade in a good manor.

Here are the treehouse courses on JavaScript and jQuery

Standard HTML and CSS wont be best to this and the above have fields designed to manipulate front end on user interaction like scrolling.

Hope this helps !

Craig