Back to the lesson

Create a notification

importance: 5

Write a function showNotification(options) that a notification: <div class="notification"> with the given content. The notification should automatically disappear after 1.5 seconds.

The options are:

// shows an element with the text "Hello" near the right-top of the window
showNotification({
  top: 10, // 10px from the top of the window (by default 0px)
  right: 10, // 10px from the right edge of the window (by default 0px)
  html: "Hello!", // the HTML of notification
  className: "welcome" // an additional class for the div (optional)
});

Demo in new window

Use CSS positioning to show the element at given top/right coordinates. The source document has the necessary styles.

Open a sandbox for the task.