From 556ef539fd8601c818a334fbce9948a89a18ac6d Mon Sep 17 00:00:00 2001 From: Farhad Date: Wed, 13 Dec 2017 09:15:41 +0330 Subject: [PATCH 1/2] Add bottomVisible --- README.md | 18 ++++++++++++++++++ snippets/bottom-visible.md | 16 ++++++++++++++++ 2 files changed, 34 insertions(+) create mode 100644 snippets/bottom-visible.md diff --git a/README.md b/README.md index 87b66d7ae..0341f5fa4 100644 --- a/README.md +++ b/README.md @@ -10,6 +10,7 @@ * [Anagrams of string (with duplicates)](#anagrams-of-string-with-duplicates) * [Average of array of numbers](#average-of-array-of-numbers) +* [Bottom visible](#bottom-visible) * [Capitalize first letter of every word](#capitalize-first-letter-of-every-word) * [Capitalize first letter](#capitalize-first-letter) * [Check for palindrome](#check-for-palindrome) @@ -85,6 +86,23 @@ const average = arr => // average([1,2,3]) -> 2 ``` +### Bottom visible + +Returns `true` if bottom of the page is visible. It adds `scrollY` to +the height of the visible portion of the page (`clientHeight`) and +compares it to `pageHeight` to see if bottom of the page is visible. + +```js +const bottomVisible = () => { + const scrollY = window.scrollY; + const visibleHeight = document.documentElement.clientHeight; + const pageHeight = document.documentElement.scrollHeight; + const bottomOfPage = visibleHeight + scrollY >= pageHeight; + + return bottomOfPage || pageHeight < visibleHeight; +} +``` + ### Capitalize first letter of every word Use `replace()` to match the first character of each word and `toUpperCase()` to capitalize it. diff --git a/snippets/bottom-visible.md b/snippets/bottom-visible.md new file mode 100644 index 000000000..403a157f8 --- /dev/null +++ b/snippets/bottom-visible.md @@ -0,0 +1,16 @@ +### Bottom visible + +Returns `true` if bottom of the page is visible. It adds `scrollY` to +the height of the visible portion of the page (`clientHeight`) and +compares it to `pageHeight` to see if bottom of the page is visible. + +```js +const bottomVisible = () => { + const scrollY = window.scrollY; + const visibleHeight = document.documentElement.clientHeight; + const pageHeight = document.documentElement.scrollHeight; + const bottomOfPage = visibleHeight + scrollY >= pageHeight; + + return bottomOfPage || pageHeight < visibleHeight; +} +``` From bab7996b3b72178ccdea68b0bc95d14614e50858 Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Wed, 13 Dec 2017 14:14:04 +0200 Subject: [PATCH 2/2] Update bottom-visible.md --- snippets/bottom-visible.md | 15 ++++----------- 1 file changed, 4 insertions(+), 11 deletions(-) diff --git a/snippets/bottom-visible.md b/snippets/bottom-visible.md index 403a157f8..9045c6bff 100644 --- a/snippets/bottom-visible.md +++ b/snippets/bottom-visible.md @@ -1,16 +1,9 @@ ### Bottom visible -Returns `true` if bottom of the page is visible. It adds `scrollY` to -the height of the visible portion of the page (`clientHeight`) and -compares it to `pageHeight` to see if bottom of the page is visible. +Use `scrollY`, `scrollHeight` and `clientHeight` to determine if the bottom of the page is visible. ```js -const bottomVisible = () => { - const scrollY = window.scrollY; - const visibleHeight = document.documentElement.clientHeight; - const pageHeight = document.documentElement.scrollHeight; - const bottomOfPage = visibleHeight + scrollY >= pageHeight; - - return bottomOfPage || pageHeight < visibleHeight; -} +const bottomVisible = _ => + document.documentElement.clientHeight + window.scrollY >= document.documentElement.scrollHeight || document.documentElement.clientHeight; +// bottomVisible() -> true ```