Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision
Previous revision
programmieren:javascript:is_in_visble_in_viewport [2021/07/06 09:50] – created jgehrkeprogrammieren:javascript:is_in_visble_in_viewport [2022/12/17 12:28] (current) – external edit 127.0.0.1
Line 4: Line 4:
  
 <code javascript> <code javascript>
- function is_in_viewport( element ) { +function is_in_viewport( element ) { 
- const rect = element.getBoundingClientRect(); + const elem_bounding   = element.getBoundingClientRect(); 
- const windowHeight = (window.innerHeight || document.documentElement.clientHeight); + const window_height   = ( window.innerHeight || document.documentElement.clientHeight ); 
- const windowWidth = (window.innerWidth || document.documentElement.clientWidth); + const window_width    = ( window.innerWidth || document.documentElement.clientWidth ); 
- const vertInView = (rect.top <= windowHeight) && ((rect.top + rect.height) >= 0); + const is_in_view_vert = ( elem_bounding.top <= window_height ) && ( (elem_bounding.top + elem_bounding.height) >= 0 ); 
- const horInView = (rect.left <= windowWidth) && ((rect.left + rect.width) >= 0);+ const is_in_view_hori = ( elem_bounding.left <= window_width ) && ( (elem_bounding.left + elem_bounding.width) >= 0 );
  
- return (vertInView && horInView); + return ( is_in_view_vert && is_in_view_hori ); 
- }+}
 </code> </code>

Page Tools