<!DOCTYPE html>
<
html
lang
=
"en"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
meta
http-equiv
=
"X-UA-Compatible"
content
=
"IE=edge"
>
<
meta
name
=
"viewport"
content
=
"width=device-width, initial-scale=1.0"
>
<
title
> Modal Methods | Blaze UI </
title
>
<
link
rel
=
"stylesheet"
href
=
<
script
type
=
"module"
src
=
</
script
>
<
style
>
html {
font-family: sans-serif;
text-align: center;
}
</
style
>
</
head
>
<
body
>
<
h2
style
=
"color: green;"
>
GeeksforGeeks
</
h2
>
<
h3
>
Modal Methods - isOpen() - Blaze UI
</
h3
>
<
p
>isOpen() : <
span
id
=
"result"
></
span
></
p
>
<
blaze-modal
id
=
"modal1"
>
<
h2
class
=
"c-heading u-super"
>
GeeksforGeeks
<
div
class
=
"c-heading__sub"
>
A Computer Science Portal for Geeks.
</
div
>
</
h2
>
<
p
>
GeeksforGeeks is a online computer
science portal which offers content
related to various computer science
branches. It also offers courses for
GATE, DSA, Competitive Programming, etc.
</
p
>
</
blaze-modal
>
<
button
class
=
"c-button c-button--info"
onclick
=
"openCloseModal()"
>
Open Modal
</
button
>
<
script
>
/*
This method opens the modal and shows the
promise return value that closes the modal
and updates the shown return value.
*/
function openCloseModal() {
document.querySelector("#modal1").show();
showPromiseValue();
setTimeout(() => {
document.querySelector("#modal1").close();
showPromiseValue();
}, 2000);
}
function showPromiseValue() {
document.querySelector("#modal1")
.isOpen().then(function (result) {
document.querySelector("#result")
.innerText = result;
});
}
</
script
>
</
body
>
</
html
>