javascript - How can I check, if all divs are fully visible inside an other div? -


i have div, called "wrapper", responsive height , overflow-y auto (so scroll enabled). inside div lots of other divs, called "box". so, example, if there 3 divs inside wrapper , see them fully, nothing should happen. if of divs inside wrapper not visible (on page load , page resize), other div (called "button") should fadein.

i found post, doesn´t solve problem: stackoverflow post

html:

<div class="wrapper">   <div class="box">box 1</div>   <div class="box">box 2</div>   <div class="box">box 3</div> </div>  <div class="button"> button </div> 

my fiddle: html + css

how can check, if divs fully visible inside other div (on page load , page resize)?

#

update: problem is, "viewport" doesnt work me, because script has check happens outside viewport (dynamically). height of divs responsive , not every time of in viewport ...

... me, found other solution. check height of main div (my main content) , if div smaller "wrapper" div, fadein "button" div.

you can try friend"

 if ($(".wrapper div").css('visibility') === 'hidden') {   // ...    } 

Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -