<style>
.floating-window {
position: fixed;
bottom: 20px;
right: 20px;
width: 300px;
background: #fff;
border: 2px solid #ff6600;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
padding: 15px;
z-index: 9999;
display: none;
}
.floating-window h3 {
margin-top: 0;
font-size: 18px;
color: #ff6600;
}
.close-btn {
position: absolute;
top: 5px;
right: 10px;
background: none;
border: none;
font-size: 18px;
cursor: pointer;
color: #999;
}
.close-btn:hover {
color: #333;
}
</style>

<div id=”myPopup” class=”floating-window”>
<button class=”close-btn” onclick=”closePopup()”>×</button>
<h3>Informasi Penting</h3>
<p>Hujan intensitas sedang sampai lebat diperkirakan terjadi sore ini. Tetap waspada terhadap banjir dan longsor Sobat Tangguh.</p>
</div>

<script>
function showPopup() {
document.getElementById(‘myPopup’).style.display = ‘block’;
}
function closePopup() {
document.getElementById(‘myPopup’).style.display = ‘none’;
}
window.onload = function() {
setTimeout(showPopup, 3000); // muncul setelah 3 detik
};
</script>