StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POJavascript - Make div follow page ( works but it pushes sidebar too?)
text
Body
copied!<p>/<em>-----------------------------------------------------------------------------------</em>/ EDIT: I do NOT want to use fixed CSS positioning. It's at the bottom of the viewport without scrolling, however I want it to follow when it gets to the top. /<em>-----------------------------------------------------------------------------------</em>/</p> <p>I'm making a Squeeze Page with a MASSIVE sidebar. It's got tons of testimonials and facts and pictures and stuff. However, I have a button near the top I want to follow the user down the page as they scroll. Shouldn't be too hard right?</p> <p>I've got this script - which starts dragging the .followme when it hits the top of the page. However - it also pushed down all the divs beneath it. Can I tell it to target JUST .follow and no affect the divs below it?</p> <pre><code><script type="text/javascript"> var documentHeight = 0; var topPadding = 15; $(function() { var offset = $(".followme").offset(); documentHeight = $(document).height(); $(window).scroll(function() { var sideBarHeight = $(".followme").height(); if ($(window).scrollTop() > offset.top) { var newPosition = ($(window).scrollTop() - offset.top) + topPadding; var maxPosition = documentHeight - (sideBarHeight + 100); if (newPosition > maxPosition) { newPosition = maxPosition; } $(".followme").stop().animate({ marginTop: newPosition }); } else { $(".followme").stop().animate({ marginTop: 0 }); }; }); }); </code></pre> <p></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload