Set Cookie on Page Load and Hide Div If Cookie Is Present

Hide div element when cookie is present

To fix this you need to remove the !important tag as jQuery doesn't understand it, therefore it's stopping the display from working:

jQuery( document ).ready(function() {
    if (document.cookie.indexOf("pum-10366") !== -1) {
       jQuery('#pum-10366').css('display', 'none');
    }
});

If you did need to include the !important tag for a reason you could toggle as class with importance already on:

CSS

  .important { display: none !important; }

JQUERY

jQuery("#pum-10366").toggleClass("important");

How to hide a div if cookie exists

Your usage of $.cookie('cookieMade', 'jobDone') is the setter of the cookie and not the getter. If you want to get the value of the cookie you should use $.cookie('cookieMade'), and check the returned value:

if ($.cookie('cookieMade') == 'jobDone') {
    // Do something if the cookie's value is 'jobDone'
}

In your case:

if ($.cookie('cookieMade') == 'jobDone') {
    // Do something if the cookie's value is 'jobDone'
    $('.box').hide();
}

update

The problem with codepen is that each time you reload the page you get a different path, and by default, $.cookie sets the path of the cookie to the current path.

You can set the path to / so the cookie will be valid for all of the pages in your domain:

$.cookie('cookieMade', 'jobDone', {path: '/'});

This will work in codepen (and should also work in your website).

Show a div if a cookie exists

Try this. This should do the trick.

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
  <script type="text/javascript">
    //pass cookie name 
    if(checkCookie('the_cookies')){
      $('#atc').show();  
    }
    else{
      $('#atc').hide();
    }

    function checkCookie($name)
    {
      if (typeof $.cookie($name) === 'undefined'){
        // set cookie if not exists
        $.cookie($name, 'the_value');
        return false;
      } else {
        return true;
      }
    }
  </script>

How to set a cookie to hide a notice bar on second page load?

Thanks a lot for your response, Henrique. However I couldn't get it to work duo to a "jQuery $.cookie is not a function" error.

I found out that "jQuery Cookie" is deprecated and js-cookie is the new version. By including that and changing the old cookie functions to the new ones it now works perfectly!

This is my final jQuery code, using "js-cookie":

window.addEventListener('load', function(){
    jQuery('#cookie-message-close').click(function(){
        jQuery('#cookie-message').hide();
    });

    if (!Cookies.get("cookie-message-bar"))
    {
        jQuery('#cookie-message').show();
        Cookies.set('cookie-message-bar', true, { expires: 60 });
    }
});

Note that I've changed $ to jQuery because of Wordpress' noConflict() mode, since I'm developing in Wordpress.

How to hide a div for 24 hours with a cookie

Thank You All The Currect Code IS

$(document).ready(function() {
  // If the 'hide cookie is not set we show the message  if (!readCookie('hide')) {    $('#applink').show();  }else {    $('#applink').hide();  }
  // Add the event that closes the popup and sets the cookie that tells us to  // not show it again until one day has passed.  $('#playstorclose').click(function() {    $('#applink').hide();    createCookie('hide', true, 1)    return false;  });
});
// ---// And some generic cookie logic// ---function createCookie(name,value,days) {  if (days) {    var date = new Date();    date.setTime(date.getTime()+(days*24*60*60*1000));    var expires = "; expires="+date.toGMTString();  }  else var expires = "";  document.cookie = name+"="+value+expires+"; path=/";}
function readCookie(name) {  var nameEQ = name + "=";  var ca = document.cookie.split(';');  for(var i=0;i < ca.length;i++) {    var c = ca[i];    while (c.charAt(0)==' ') c = c.substring(1,c.length);    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);  }  return null;}
function eraseCookie(name) {  createCookie(name,"",-1);}

<div class="playstorapp" id="applink" style="text-align: center;margin: auto">        <a id="playstorclose" href="JavaScript:void(0)">X</a>        <a class="applink" href="https://play.google.com/store/apps/details?id=com.aradev.net&rdid=com.aradev.net" target="_blank">            Download        </a>    </div>

How to hide div serverside by reading cookie

On page load, you could use php to check the cookie, and then add a hidden class. Something like <div class="<?= $_COOKIE['intro'] == 'collapsed' ? 'hidden':'' ?>">

Edit:

In CSS then, you can add something like .hidden { display: none; } and use jQuery to add or remove that class.

Hide/Remove Div if cookie is set

Just write to the div dynamically.

Change the div to be empty

<div id="apDiv1"> </div>

Write the flash from the IF statement. (You could do this using dom)

...
if(!readCookie('wroteIt')) {
// if cookie not found display the div and create the cookie

document.getElementById('apDiv1').innerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="560" height="314" id="FLVPlayer">
    <param name="movie" value="FLVPlayer_Progressive.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="transparent" />
    <param name="scale" value="noscale" />
    <param name="salign" value="lt" />
    <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Clear_Skin_1&streamName=FL_Spot&autoPlay=true&autoRewind=false" />
    <param name="swfversion" value="8,0,0,0" />
  </object>';

...