Jonathan Cox
Jonathan Cox

Reputation: 361

Using JavaScript to create a Chrome-style alert

How do I create an alert in Chrome using JavaScript that opens a text box in the middle of the browser window and washes out the background, like so:

a pretty Chrome alert

rather than an alert that just pops up an entirely new window (in my case in the Linux Mint GTK theme):

an ugly GTK popup

If I type alert() into the console, I get an alert that looks like the latter, in a separate window.

Upvotes: 1

Views: 1155

Answers (1)

Daniel Herr
Daniel Herr

Reputation: 20488

You should use the dialog element. Something like this:

HTML:

<dialog>
  This is a dialog.<br>
  <button>Close</button>
</dialog>

Javascript:

var dialog = document.querySelector("dialog")
dialog.querySelector("button").addEventListener("click", function() {
  dialog.close()
})
dialog.showModal()

Upvotes: 3

Related Questions