Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Many aspects of displaying notifications are up to browsers, but in particular in this case you need to show more then one notification at the same time you can set a different "tag" attribute to each notification (<a href="http://www.w3.org/TR/notifications/#tags-example" rel="noreferrer">http://www.w3.org/TR/notifications/#tags-example</a>). If you don't specify a tag, the default one is used and the last notification "wins" over the previous ones.</p> <p>Check this example:</p> <pre><code>&lt;button id="authorize"&gt;Authorize notification&lt;/button&gt; &lt;button id="show"&gt;Show notification&lt;/button&gt; &lt;button id="show_another"&gt;Show another notification&lt;/button&gt; &lt;script&gt; function authorizeNotification() { Notification.requestPermission(function(perm) { alert(perm); }); } function showNotification(myTag) { var notification = new Notification("This is a title with tag " + myTag, { dir: "auto", lang: "", body: "This is a notification body with tag " + myTag, tag: myTag, }); } document.querySelector("#authorize").onclick = authorizeNotification; document.querySelector("#show").onclick = function(){ showNotification("firstTag"); }; document.querySelector("#show_another").onclick = function(){ showNotification("secondTag"); }; &lt;/script&gt; </code></pre> <p>If you click "show notification" many times, the notification is closed and a new one is opened. Using the second button a new notification is shown without closing the old one.</p> <p>You can find a working sample at JSFiddle (<a href="http://jsfiddle.net/TuJHx/350/" rel="noreferrer">http://jsfiddle.net/TuJHx/350/</a>)</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload