Close div on all site pages when user clicks x

Question

I need to find the right code to make div boxes disappear throughout the site when the user clicks the "x" to close the window.

As part of a new website I'm building, I'm adding alert boxes that will appear on all site pages when necessary. Think "News Alerts" or "Site Maintenance" alerts that appear on the top of each page, so that it's conspicuous to all site visitors.

See example:

When the user clicks the x, the alert box should disappear from the current page, and not display when the user visits other pages on the site during this session.

Each alert box is embedded into the HTML for each page via a PHP include.

Any help would be greatly appreciated. My efforts to find a solution on this site and elsewhere on the web have been fruitless. Thanks.

If this is intended to extend between visits, I think a cookie is the only way. — Joe, Jun 27 '14 at 02:36
As @Joe said. You'll check for the cookie and show or ignore the notification according to whether it's set. You could also use sessions, which would last for the period your browser window is open then revert to the original state next time you open it. — scrowler, Jun 27 '14 at 02:37
I appreciate the feedback. Thanks very much! ... A browser session is fine. I want the user to see the alert box the next time they visit the site, in case there's new information... Can anybody direct me to the right code to make this all happen? — Michael Benjamin, Jun 27 '14 at 02:56
@mbnyc You might want to take a look at [this](http://machinesaredigging.com/2013/10/29/how-does-a-web-session-work/); it gives an overview of sessions in a general sense (explains what they are, how they're used, etc.). [This question](http://stackoverflow.com/questions/3804209/what-are-sessions-how-do-they-work) might also be of use to you. — AstroCB, Jun 27 '14 at 03:09
@AstroCB Thanks! I'm reading them now. Again, any turnkey solution for this would be great. — Michael Benjamin, Jun 27 '14 at 16:05

Pierre HUBERT · Answer 1 · 2014-06-27T04:17:02.920

This is the code JAVASCRIPT for clean a <div> by an ID :

document.getElementById('idName').innerHTML="";

For example :

<div id="toclose">This is a text</div>
<input type="button" value="Close" onClick='document.getElementById("toclose").innerHTML="";' />

And for all the session you should use ajax to create a cookie which contain the order to don't show the message again.

Basic function for Ajax :

<script>function hiddiv(file) {

     var xhr = new XMLHttpRequest();
     xhr.open('GET', file);
     xhr.send(null);
}

Usage (example) :

<input type="button" value="Close" onClick="hiddiv('hidediv.php?id=2');" />

And for the PHP (hidediv.php) :

<?php
if(isset($_GET['id']))
{
  setcookie("blocdivid".$_GET['id'], "1", time()+3600);
}
?>

}

That JS is *very* poorly typed... you should probably fix it. At least for me, I like to be able to understand what code is doing without going through it for ten minutes. Also, you should probably guide the OP in a general direction of how to use AJAX to create a cookie. — Alonessix, Jun 27 '14 at 03:40

Dev · Answer 2 · 2014-06-27T04:25:11.707

You can use jquery to hide then make a cookie notified=yes for current session. and check this cookie before showing alert.

You know how to create notification so you can use this code for not showing during current session

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++) {
        var c = ca[i].trim();
        if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
    }
    return "";
}

function clearCook(){
    document.cookie="notified=";
}

Close div on all site pages when user clicks x

2 Answers2