title: How to make user hover for two sec before slideDown
body: <p>I have a working code below that does <code>slideDown</code> functionality, but I want the user to hover for 2 sec at least before it should slide down. If the user doesn't hover for 2 sec it should not slide down.</p>
  
  <p>I had tried the delay but it still fires even though I haven't hovered on the link for 10 sec.</p>
  
  <p>Here is my code below and <a href="https://jsfiddle.net/dev2020/zsdgjsz7/2/" rel="nofollow">fiddle </a>: </p>
  
  <pre><code>$(document).ready(function() {
      $(".item-content").hide();
  
      $(".item-show").on("mouseover", function() {
          $(this).delay(10020).hide().parent('p').next(".item-content").delay(1520).slideDown( "slow" );
      });
  
      $("span.close-icon").on("click", function() {
          $(this).parent('.item-content').slideUp('slow').parent().find('.item-show').show();
      });
  });
  
  $("div.previewCardPageClose").on("click", function() {
      $(this).parent('.previewCard-content').slideUp('slow').parent().find('.previewCard-showhide').show();
  });
  </code></pre>