Fixed element when scrolled

[Milk]

Hi.



I have an element which I want to be position:fixed after a certain point in scrolling. Something like this.

However, I want it to fixed be at the bottom of the page not the top.

To rephrase this: I want the element to initially not be visible until you scroll down to it. e.g a position:absolute with top:1500px. Once you reach the element, I want it to be fixed at the bottom of the page. e.g. a position:fixed with bottom:0.


I'm not good with jquery. Can somebody please help me?

Many thanks!

[David Clark]

Hey Milk, I moved this thread over to the plugin development board since you're working on a JS issue.

[Milk]

Nevermind. I've found a solution.

[P̌̓aͧś̀t̀u͒le͆o͂2̀3̃̓]

Feb 20, 2015 3:44:48 GMT -8 Milk said:

Hi.



I have an element which I want to be position:fixed after a certain point in scrolling. Something like this.

However, I want it to fixed be at the bottom of the page not the top.

To rephrase this: I want the element to initially not be visible until you scroll down to it. e.g a position:absolute with top:1500px. Once you reach the element, I want it to be fixed at the bottom of the page. e.g. a position:fixed with bottom:0.


I'm not good with jquery. Can somebody please help me?

Many thanks!

So what you want to do is make an element, detect when srolling reaches 1500 px and then html
<div id="alwaysbottom" style="position:absolute" >BOTTOM</div>
where bottom is your content
javascript would be
setInterval(function(){

if(parseInt($(window).scrollTop())>=1500){$('#alwaysbottom').css({"position":"fixed","bottom":"0"})}

},100);
This repeatedly looks for scrolling to be 1500 and then fixes it permanently to the bottom