w3resource

JavaScript: Return true if the bottom of the page is visible, false otherwise

JavaScript fundamental (ES6 Syntax): Exercise-261 with Solution

Write a JavaScript program that returns true if the page bottom is visible, false otherwise.

  • Use scrollY, scrollHeight and clientHeight to determine if the bottom of the page is visible.

Sample Solution:

JavaScript Code:

//#Source https://bit.ly/2neWfJ2 
// Define a function 'bottomVisible' to check if the bottom of the page is visible
const bottomVisible = () =>
  // Check if the sum of the client height of the document element and the scroll Y offset
  // is greater than or equal to the maximum of the scroll height of the document element
  // and the client height of the document element
  document.documentElement.clientHeight + window.scrollY >=
  (document.documentElement.scrollHeight || document.documentElement.clientHeight);

// Check if the bottom of the page is visible
console.log(bottomVisible());

Output:

true

Flowchart:

flowchart: Return true if the bottom of the page is visible, false otherwise.

Live Demo:

See the Pen javascript-basic-exercise-261-1 by w3resource (@w3resource) on CodePen.


Improve this sample solution and post your code through Disqus

Previous: Write a JavaScript program to evaluate the binomial coefficient of two integers n and k.
Next: Write a JavaScript program to create a base-64 encoded ASCII string from a String object in which each character in the string is treated as a byte of binary data.

What is the difficulty level of this exercise?

Test your Programming skills with w3resource's quiz.



Become a Patron!

Follow us on Facebook and Twitter for latest update.

It will be nice if you may share this link in any developer community or anywhere else, from where other developers may find this content. Thanks.

https://w3resource.com/javascript-exercises/fundamental/javascript-fundamental-exercise-261.php