This commit is contained in:
Angelos Chalaris
2017-12-14 13:17:20 +02:00
parent 7de373b34f
commit 1e0f46cb6c
2 changed files with 8 additions and 8 deletions

View File

@ -329,8 +329,8 @@ const dropElements = (arr,func) => {
[⬆ back to top](#table-of-contents) [⬆ back to top](#table-of-contents)
### Element is visible in viewport ### Element is visible in viewport
Use `Element.getBoundingClientRect()` and the `window.inner(Width|Height)` values Use `Element.getBoundingClientRect()` and the `window.inner(Width|Height)` values
to determine if a given element is visible in the viewport. to determine if a given element is visible in the viewport.
Omit the second argument to determine if the element is entirely visible, or specify `true` to determine if Omit the second argument to determine if the element is entirely visible, or specify `true` to determine if
it is partially visible. it is partially visible.
@ -343,8 +343,8 @@ const elementIsVisibleInViewport = (el, partiallyVisible = false) => {
: top >= 0 && left >= 0 && bottom <= innerHeight && right <= innerWidth; : top >= 0 && left >= 0 && bottom <= innerHeight && right <= innerWidth;
} }
// e.g. 100x100 viewport and a 10x10px element at position {top: -1, left: 0, bottom: 9, right: 10} // e.g. 100x100 viewport and a 10x10px element at position {top: -1, left: 0, bottom: 9, right: 10}
// elementIsInViewport(el) -> false (not fully visible) // elementIsVisibleInViewport(el) -> false (not fully visible)
// elementIsInViewport(el, true) -> true (partially visible) // elementIsVisibleInViewport(el, true) -> true (partially visible)
``` ```
[⬆ back to top](#table-of-contents) [⬆ back to top](#table-of-contents)

View File

@ -1,7 +1,7 @@
### Element is visible in viewport ### Element is visible in viewport
Use `Element.getBoundingClientRect()` and the `window.inner(Width|Height)` values Use `Element.getBoundingClientRect()` and the `window.inner(Width|Height)` values
to determine if a given element is visible in the viewport. to determine if a given element is visible in the viewport.
Omit the second argument to determine if the element is entirely visible, or specify `true` to determine if Omit the second argument to determine if the element is entirely visible, or specify `true` to determine if
it is partially visible. it is partially visible.
@ -14,6 +14,6 @@ const elementIsVisibleInViewport = (el, partiallyVisible = false) => {
: top >= 0 && left >= 0 && bottom <= innerHeight && right <= innerWidth; : top >= 0 && left >= 0 && bottom <= innerHeight && right <= innerWidth;
} }
// e.g. 100x100 viewport and a 10x10px element at position {top: -1, left: 0, bottom: 9, right: 10} // e.g. 100x100 viewport and a 10x10px element at position {top: -1, left: 0, bottom: 9, right: 10}
// elementIsInViewport(el) -> false (not fully visible) // elementIsVisibleInViewport(el) -> false (not fully visible)
// elementIsInViewport(el, true) -> true (partially visible) // elementIsVisibleInViewport(el, true) -> true (partially visible)
``` ```