I'm in the process of setting up a cookie using jQuery Cookie to display an alert for new visitors. When the "close" button is clicked, a cookie will be set to prevent the alert div from displaying again. Additionally, I want this cookie to expire after 24 hours.
After experimenting with some code, I was able to achieve the desired functionality, but there's one issue. The alert div is shown by default and only hidden when the close button is clicked. However, when the cookie exists, the alert still displays briefly before being hidden.
How can I modify the code below so that the div is hidden by default? If the cookie doesn't exist, it should be displayed, and if the close button is clicked, a cookie is generated to hide the alert for 24 hours?
if ($.cookie('alert')) {
$('.alert-box').hide();
} else {
$(".close").click(function() {
$( ".alert-box" ).slideUp( "slow", function() { });
$.cookie('alert', true);
});
}