Create blinking notification with JavaScript
Style
.notification {
position: fixed;
z-index: 1000;
padding: 5px;
border: 1px solid black;
font-size: 20px;
background: white;
text-align: center;
}
.welcome {
background: #b80000;
color: yellow;
}
JS –
function showNotification({top=0,right=0,background="#ededed",color="blue",html=""}){
let notification = document.createElement('div');
notification.className = "notification";
notification.innerHTML = html;
notification.style.top = top+"px";
notification.style.color = color;
notification.style.right = right+"px";
notification.style.background = background;
document.body.append(notification);
setTimeout(()=>notification.remove(),1000);}
let i = 1;
setInterval( ()=>showNotification({
top: 0,
right: 0,
color: 'yellow',
background: "red",
html: "hellow "+ i++
}
), 1500 );
You can use setTimeout function instead of setInterval to show notification only once
setTimeout(()=>showNotification({
top: 0,
right: 0,
color: 'yellow',
background: "red",
html: "hellow "+ i++
}), 1500 );