Delay popup loading after click-CodePudding

All I need it to do is delay the popup from "popping" for a few seconds after clicking a button. Is there anything wrong with this code?

$(document).ready(function() {
  $('#element-167 a').on("click", function() {
    $('.modal-dialog').delay(5000).fadeIn();
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

CodePudding user response：

You could use queue() and pass a function as parameter:

$(document).ready(function() {
  $('#element-167 a').on("click", function() {
    $(".modal-dialog").delay(5000).queue(() => {
      // Do things after 5 seconds
      $('.modal-dialog').fadeIn();
    })
  });
});

CodePudding user response：

Try using setTimeout

$(document).ready(function() {
  $('#selected').on("click", function() {
      setTimeout(()=>{alert("Message here")},5000)
  });
});

<p id="selected">This is second paragraph.</p>