Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Detect if an element is REALLY visible

Tags:

javascript

If an element can be seen by human being, ALL of the following must be true:

  • jQuery(elem).is(':visible') returns true. In jQuery 1.3.2+, an element is visible if its browser-reported offsetWidth or offsetHeight is greater than 0.
  • visibility style is not hidden.
  • opacity style is not 0.

However, these do not cover all cases. For instance, one easy case I can think of is, if an element falls outside of one of its ancestors' visible area and that ancestor has a style overflow: hidden, then the element can not be seen.

Any existing examples/jQuery plugins/etc. that cover most (if not all) of possibilities?

like image 930
powerboy Avatar asked Nov 03 '22 17:11

powerboy


1 Answers

It is impossible to detect whether an element can be seen by human being or not. Here are a few more cases you cannot cover:

  1. another browser tab is open
  2. another application hides the browser window
  3. the monitor is turned off
  4. the user has her eyes closed ... etc.

[end of irony]

like image 102
dokaspar Avatar answered Nov 15 '22 07:11

dokaspar