Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript

Jquery On Scroll effect Bottom Banner

Hi everybody,

I want to try to get a bottom banner to my website. Similar to a stick nav when some one scrolls down the nav attaches itself to the browser window. I am trying something similar to an element mid-way of the webpage where it will get attached to the bottom of the window and dis-attach when scrolled back up.

Chris

John Coolidge
John Coolidge
12,614 Points

I'm not sure if I understand you correctly. You have a banner on the page that is half-way down. Then when you scroll down the page, it sticks to the bottom.

When you scroll down, the banner in the middle of the page is going to rise to the top of the page. You could then stick that banner to the top (this happens on your Treehouse profile page when you scroll down, as an example).

You can definitely stick it to the top but I'm not sure if when you scroll down you can get it to stick to the bottom, since the banner would naturally move to the top of the window upon scrolling down.

Could you elaborate more please?

John

2 Answers

Did a quick Google search and ran across something called hcsticky. Looks like it might give you the functionality you're looking for. If not, try another search, there seem to dozens of sticky-type plug-ins.

Thank you Joe, That is what I am looking for. I did research other plugins to us but I had unsuccessful attempts. This plugin worked perfectly. Thank you again.