javascript - Always show a DIV as soon as its not visible any more after scrolling down? -


i have info box (div) on screen when user opens website. user scrolls down , box not visible user longer, want box appear in top right corner time while scrolling.

i know how make visible time (position: fixed). problem is, how know when not visible user ans more while scrolling? can use javascript, if helps. id prefer prototype js.

thanks!

you need make use of getboundingclientrect(), returns element's positions relative viewport. if top value below 0, should fixed.

html:

<div id="stick">     should fixed… </div> 

css:

#stick {     position: absolute;     top: 60px; }  #stick.fixed {     position: fixed;     top: 0; } 

js:

var stick = document.getelementbyid('stick');  window.onscroll = function(){     if(stick.getboundingclientrect().top < 0){         stick.classname = 'fixed';     } else if(stick.classname.indexof('fixed') < 0){         stick.classname = '';     } } 

here's demo.


Comments

Popular posts from this blog

java - Jmockit String final length method mocking Issue -

asp.net - Razor Page Hosted on IIS 6 Fails Every Morning -

c++ - wxwidget compiling on windows command prompt -