25 June 2023

In jQuery, the :visible selector is used to select elements that are currently visible on the web page. The code snippet checks if an element has a non-zero width, a non-zero height, or non-zero client rects. If any of these conditions are true, it considers the element as visible. Note that this approach does not handle elements that may be partially visible or hidden due to CSS properties like opacity. It only checks for the element's dimensions and layout visibility.

Source code viewer
  1. // NB: This is a drop-in replacement for jQuery :visible. Read from the description why it doesn't work on every occasion.
  2. function isVisible(el) {
  3.     return !!( el.offsetWidth || el.offsetHeight || el.getClientRects().length);
  4. }
Programming Language: Javascript