Notification
Mon May 22 2023 15:20:58 GMT+0000 (Coordinated Universal Time)
Saved by
@Moriaan
#javascript
/* NOTIFICATION ___________________________________________________________________________________ */
var notification_number = 0;
function noti(title, text, color, bgcolor) {
var not = document.createElement("div");
not.style = "transition-duration:0.5s;width:300px;border-radius:8px;padding:10px;position:fixed;z-index:999;" +
"bottom:20px;right:20px;";
if (color) { not.style += "color:" + color + ";" }
if (bgcolor) { not.style += "background-color:" + bgcolor + ";" }
not.innerHTML =
"<span id='notification_" + notification_number + "' class='closeButton' style='position:absolute;top:2px;right:10px;font-size:30px;cursor:pointer;'>×</span>" +
"<h2 style='margin:0px;'>" +
title + "</h3><hr style='border-color:" +
color + ";'><p style='margin-top:15px;margin-bottom:10px;font-size:1.2em;'>" +
text + "</p>";
not.classList.add("notification");
not.id = "notification_" + notification_number + "_div";
notification_number++;
document.body.appendChild(not);
var closeButtons = document.querySelectorAll(".closeButton");
closeButtons.forEach(element => {
element.addEventListener("click", function () {
var delNot = document.getElementById(element.id + "_div");
delNot.style.opacity = "0";
setTimeout(() => {
delNot.remove();
}, 1000);
});
});
setTimeout(() => {
if (not) {
not.style.opacity = "0";
}
}, 5000);
setTimeout(() => {
if (not) {
not.remove();
}
}, 6000);
}
content_copyCOPY
Comments