javascript - Get non visible inner div -

i have div(parentdivstyle) position absolute parent div. have 5 children(childdivstyle) div inside parent div position relative. have set overflow hidden of parent div. of child divs not visible. divs not visible jquery. there way?

i have googled , of results related "visible" property, not want. , not preferring plugin. please.

css

.parentdivstyle {     overflow:hidden;     width:300px;     height:50px;     position:absolute;     background:#ccc;     float:left; } .childdivstyle {     width:100px;     height:50px;     position:relative;     float:left;     background:red;     border: 1px solid black; } 

html

<div class="parentdivstyle"> <div class="childdivstyle">1</div> <div class="childdivstyle">2</div> <div class="childdivstyle">3</div> <div class="childdivstyle">4</div> <div class="childdivstyle">5</div> </div> 

jsfiddle

using this answer getting coordinates of elements, can figure out elements in respect each other. once know coordinates of visible area, can figure out child elements visible.

this tell whether elements visible, , if not, direction respects container.

displaycoords = function(element) {     var rect = element.getboundingclientrect();     console.log(rect.top, rect.right, rect.bottom, rect.left);         var childelements = element.children;     for(i = 0; < childelements.length; i++)     {         childrect = childelements[i].getboundingclientrect();         console.log(childrect.top, childrect.right, childrect.bottom, childrect.left);           if(childrect.top >=  rect.bottom)             console.log("not visible -- off bottom of element");         else if(childrect.left >= rect.right)             console.log("not visible -- off right of element");         else if(childrect.bottom <= rect.top)             console.log("not visible -- off top of element");         else if(childrect.right <= rect.left)             console.log("not visible -- off left of element");     }  } 

i forked jsfiddle here