Question 207141 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Jquery – How to hide an element after click and leave it hidden until day after

do you know (in jquery or vanilla) how to hide an element for a defined time (or during all user session) after the user has clicked a button (in jquery or vanilla)?

SCENARIO:

  1. user goes to Page1 and click on a link button. This button removes class to ElementX (making it desappears). Until here no problem.
  2. after user goes to Page2 and he must NOT see ElementX (this must last for 24 hours).

now I have this (but it doesn’t work ):

$(document).ready(function(){

  $('#active-promos').addClass('show');

  $('.close-promos').click(function(){

    $('#active-promos').removeClass('show');

    if (!sessionStorage.isActive) {
      $('#active-promos').removeClass('bell');
      sessionStorage.isActive = 1;
    }

  });

});

thank you

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    ok here we are, I got it!

    this is my solution:

      //Get current time
  var currentTime = new Date().getTime();
  //Add hours function
  Date.prototype.addHours = function(h) {
    this.setTime(this.getTime() + (h*60*60*1000));
    return this;
  }
  //Get time after 24 hours
  var after24 = new Date().addHours(24).getTime();
  //remove class on click
  $('.open-promos').click(function(){
    $('#active-promos').removeClass('bell');
    //Set desired time till you want to hide that div
    localStorage.setItem('desiredTime', after24);
  });
  //If desired time >= currentTime, based on that add or remove class
  if(localStorage.getItem('desiredTime') >= currentTime) {
    $('#active-promos').removeClass('bell');
  }
  else {
    $('#active-promos').addClass('bell');
  }

  2. 0

    Ya, you can use setTimeout!

    var now = new Date();
var tomorrow = new Date();
tomorrow.setDay(now.getDay() + 1);
tomorrow.setHours(0);
tomorrow.setMinutes(0);
tomorrow.setSeconds(0);
tomorrow.setMilliseconds(0);

setTimeout(function() {
  $('#active-promos').addClass('show');
}, tomorrow.getTime() - now.getTime());
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search