ecvis
2/13/2019 - 5:31 PM

JS class change event listener saved in cookie

I am using this on website I am building at the moment, to set an overlay element that gets hidden if clicked on it. This action gets recorded as cookie, and it expires on next day. It can be used to store various user interactions into a cookie.

set_event_result_into_cookie.js
content_copyfile_download
// dependency: https://github.com/js-cookie/js-cookie
  // wait for the document to load
window.onload = function() {
  // aaand wait a bit more
  setTimeout( function(){

    // set variables for the dom element & the cookie
    var myElementlogo = document.querySelector("#myID");
    var cookieExists = Cookies.get('logoHider');
    
    // check weather cookie exhists and if yes, then hide the logo
    if (!cookieExists) {
      myElement.classList.remove("hide");

    // eventlistener alternative method for backward compatibility (IE < 9)
    logo.onclick = 
      function hideElement() {
      myElement.classList.add("hide");
      Cookies.set('elementHider', 'yes', { expires: 1, path: '', domain: '.mydomain.com' });
    }
    
    // initial method i used, but not suitable for older browser 
    // addEventListener('click', hideElement, false);
  
    } else if (cookieExists) {
      myElement.classList.add("hide");
    }
  }, 100); 
};