JSFiddle - React, Tailwind, and code Playground

by magizter

HTML

<div id="dialog" style="display:none;">
    Első ablak szöveg
</div>


<div id="dialog2" style="display:none;">
   Második ablak szöveg
</div>

<div id="dialog3" style="display:none;">
   Harmadik ablak szöveg
</div>

JavaScript

$('#dialog').dialog({
    autoOpen: true,
    show: "blind",
    hide: "explode",
    modal: true,
    open: function(event, ui) {
        setTimeout(function(){
            $('#dialog').dialog('close');
        }, 3000);
    }
});


$(function(){
 $('#dialog2').dialog({
   autoOpen: false,
     hide: "explode",
open: function(event, ui) {
        setTimeout(function(){
            $('#dialog2').dialog('close');
        }, 3000);
    }     
 });
});

function openMyDialog2(){
 $('#dialog2').dialog('open');
}

$(document).ready(function(){
 setTimeout(function(){
    openMyDialog2();}, 4000);
});

$(function(){
 $('#dialog3').dialog({
   autoOpen: false,
     hide: "explode",
open: function(event, ui) {
        setTimeout(function(){
            $('#dialog3').dialog('close');
        }, 3000);
    }     
 });
});

function openMyDialog3(){
 $('#dialog3').dialog('open');
}

$(document).ready(function(){
 setTimeout(function(){
    openMyDialog3();}, 8000);
});