JSFiddle - React, Tailwind, and code Playground
HTML
<div id="message-1" class="msgbox" style="display: none;"><div class="guestwarn"><a href="#" class="close" onclick="closeBox('message-1'); return false;" title="Close"></a>
Testo</div></div>
CSS
div.guestwarn {
background: {vb:raw vboptions.guest_warn_color};
color: {vb:raw vboptions.guest_warn_text_color};
max-width:280px;
min-height:18px;
padding:0 5px 3px;
position:fixed;
right: {vb:raw vboptions.guest_var_width}%;
top: {vb:raw vboptions.guest_var_height}%;
padding: 10px 15px;
position: fixed;
z-index: 10;
font-size:12px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
filter:alpha(opacity={vb:raw vboptions.guest_var_opacity});
-moz-opacity:.{vb:raw vboptions.guest_var_opacity};
opacity:.{vb:raw vboptions.guest_var_opacity};
-moz-box-shadow:5px 5px 5px #191919;
-webkit-box-shadow:5px 5px 5px #191919;
box-shadow:5px 5px 5px #191919;
/*display: none;*/
}
}
.close {
float: right;
background: transparent url({vb:raw vboptions.guest_warn_image});
width: 22px;
height: 22px;
}
JavaScript
function closeBox(toClose) {
document.getElementById(toClose).style.display = "none";
setCookie(toClose, "closed", 50);
}
function setCookie(cName, value, expiredays) {
var expDate = new Date();expDate.setDate(expDate.getDate()+expiredays);
document.cookie=cName + "=" + escape(value) + ";expires=" + expDate.toGMTString();
}
function loadMsg(msgClass) {
msg = document.getElementsByTagName("div");
for (i=0; i<msg.length; i++){
if(msg[i].className == msgClass) {
if(document.cookie.indexOf(msg[i].id) == -1) {
msg[i].style.display = "block";
}
}
}
}
window.onload=function(){
loadMsg('msgbox');
}