StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>The slideUp() method hides but doesn't remove, so testing whether the element is still in the DOM won't help.</p> <blockquote> <p><em>"so how do I detect if the element has had a slideup event?"</em></p> </blockquote> <p>You can use the <a href="http://api.jquery.com/visible-selector/" rel="nofollow"><code>:visible</code> selector</a> in combination with the <a href="http://api.jquery.com/is/" rel="nofollow"><code>.is()</code> method</a> to test whether the element is currently visible:</p> <pre><code>if ($('#cookies_notification').is(':visible')) { // element is visible, so do something } </code></pre> <p>That would also cover the case where the <code>'#cookies_notification'</code> element doesn't exist in the DOM at all, because <code>$('#cookies_notification')</code> would return an empty jQuery object for which <code>.is(':visible')</code> would be false.</p> <p>The other way you can use the <code>:visible</code> selector for this purpose is similar to the first answer above:</p> <pre><code>if( $('#cookies_notification:visible').length > 0 ) { // element is visible, so do something } </code></pre> <p>That is, select the element only if visible and then see whether the resulting jQuery object is empty.</p> <p>To test if an element is there but <em>not</em> visible you can use the <a href="http://api.jquery.com/hidden-selector/" rel="nofollow"><code>:hidden</code> selector</a>:</p> <pre><code>if ($('#cookies_notification').is(':hidden')) { </code></pre> <p>In one of your updates you also asked about this code:</p> <pre><code>$(this).slideUp().css('display','none'); </code></pre> <p>The reason this hides the element immediately without the slide-up is that <code>.slideUp()</code> is an asynchronous animation method - when you call it it queues up the animation but then the method returns immediately. So then your <code>.css()</code> part is executed before the slide-up is finished, hiding the element immediately. You don't need to include the <code>.css()</code> part because once the slide up animation is finished jQuery will have hidden the element anyway.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload