Razvan horatiu
Razvan horatiu

Reputation: 86

How can i make a popup with expire session

I have an image popup that appears on every page I navigate.

I need to know how is it possible to make it disappear if I click on close, it won't show up again for that session.

  <body onclick="document.getElementById('anuntImportant').style.display='none'">
      <div id="anuntImportant" style="position: absolute; top:30%;left:40%; display:block;overflow:visible; z-index:1000">
          <img src="image/data/program-sarbatori.jpg">
      </div>
  </body>

Upvotes: 0

Views: 64

Answers (1)

jcubic
jcubic

Reputation: 66590

You can use sessionStorage for that:

function hide() {
  document.getElementById('anuntImportant').style.display='none';
  if (window.sessionStorage) {
    sessionStorage.setItem('hideAnuntImportant', true);
  }
}
window.onload = function() {
  if (window.sessionStorage) {
    if (JSON.parse(sessionStorage.getItem('hideAnuntImportant'))) {
       document.getElementById('anuntImportant').style.display='none';
    }
  }
}

<body onclick="hide()">

or use php session, you will need to call ajax request on click and and in php call start_session and set $_SESSION['anuntImportant'] to true and when you render the element you set style="display: none"

ajax.php

<?php
start_session();
$_SESSION['anuntImportant'] = true;
?>

yourpage.php

<?php 
start_session();
?>
  <body onclick="document.getElementById('anuntImportant').style.display='none'">
      <div id="anuntImportant" style="position: absolute; top:30%;left:40%; display:<?= $_SESSION['anuntImportant'] ? 'none' : 'block' ?>;overflow:visible; z-index:1000">
          <img src="image/data/program-sarbatori.jpg">
      </div>
  </body>

Upvotes: 1

Related Questions