on my Wordpress site I add a button that when clicked calls a modal to open via ajax. When I click the button once on a fresh reload of the page it seems to work fine without any hiccups. If I close that modal then and click the button to open it again, without refreshing the page it will open, but flicker once and then stay opened. If I close it again and open it back up it flickers 3-4 times before staying open. And this continues with more flickers the more I click the button.

jQuery(document).ready(function ($) {
function qdLoadModal(){
    var options = {
            modal: true,

        opacity: 1.0,
    }, 250, function() {
        // Animation complete.


//Launch Quiz Modal
$('.calcLaunch').click(function( event ) {

That is the jQuery I am using to load in the modal file on button click. I can't figure out why the modal does the flickering thing when opened multiple times without reloading the page. If more information about my code is needed I can supply it, but really not sure what to do to fix it after a few hours of trying to troubleshoot it.

EDIT: I actually found a fix for this. I changed the click function to:

    $('.calcLaunch').one("click", function( event ){

Changing the function to this then only runs it once on click removing the flicker.

  • WordPress is sort of incidental here. This is mostly a pure JavaScript question. You'll probably have more luck asking at stackoverflow.com Jul 30, 2018 at 14:39
  • even i am facing the same issue , but the above mentioned solution did not work for me, is there any other way to resolve this?
    – user192284
    Jul 27, 2020 at 9:10

1 Answer 1


Try removing children inside #qdModalWindow before attempting load new content inside it.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.