openpolitics.com

How to check if an element is hidden in jQuery?

It is possible to toggle the visibility of an element, using the functions .hide(), .show() or .toggle().

How would you test if an element is visible or hidden?

<span class="com">// Checks for display:[none|block], ignores visible:[true|false]</span><span class="pln">
$</span><span class="pun">(</span><span class="pln">element</span><span class="pun">).</span><span class="kwd">is</span><span class="pun">(</span><span class="str">":visible"</span><span class="pun">);</span> 

Example of using the visible check for adblocker is activated:

<span class="pln">$</span><span class="pun">(</span><span class="pln">document</span><span class="pun">).</span><span class="pln">ready</span><span class="pun">(</span><span class="kwd">function</span><span class="pun">()</span>
                  <span class="pun">{</span>
  <span class="kwd">if</span><span class="pun">(!</span><span class="pln">$</span><span class="pun">(</span><span class="str">"#ablockercheck"</span><span class="pun">).</span><span class="pln">is</span><span class="pun">(</span><span class="str">":visible"</span><span class="pun">))</span>
  <span class="pun">{</span><span class="pln">
    $</span><span class="pun">(</span><span class="str">"#ablockermsg"</span><span class="pun">).</span><span class="pln">text</span><span class="pun">(</span><span class="str">"Please disable adblocker."</span><span class="pun">).</span><span class="pln">show</span><span class="pun">();</span>
  <span class="pun">}</span>
<span class="pun">});</span>