JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="map_size" class="map_size">
<div id="msg">
new records available.
</div>
</div>
</div>
CSS
body{
margin:0px auto;
width:80%;
height:80%;
font-family: Verdana,Geneva,sans-serif;
}
/*container for all divs inside*/
#container {
width:1450px;
}
/*map size*/
#map_size{
width:1190px;
height:1300px;
background:#0099FF;
border-style: solid;
border-color: black;
position: relative;
float:left;
}
/*msg*/
.station_info_ {
z-index: 100;
position: absolute;
background-color:white;
border-radius: 5px;
height: 200px;
margin-left: 50px;
width: 275px;
border:4px solid black;
}
JavaScript
$('document').ready(function(){
$('#msg').hide();
window.setTimeout(
function(){
$('#msg').show();
setInterval(function(){ $('#msg').toggle(); }, 100);
}
,3000);
});