How to show DIV on first visit and not any visit after until browser is closed

Question

I have the following script which slides in/slide out a DIV from the right:

// jQuery 1.9 > Toggle Event dep 1.8
$(\'#slideClick\').click(function () {
    va         


        

Answer 1

UPDATED ANSWER PER COMMENTS

If you know your browsers support it, you can use sessionStorage instead of the data element. Also to make it more DRY I have added additional functions. You would use it something like this:

$(function() {
  function showContent(dir) {
    var pxVal = '0px', img='arrow-collapse';
    if (dir === 'close') {
        pxVal = '-290px';
        img = 'arrow-expand';
    }
    $('#slideOut').animate({ right: pxVal }, { queue: false, duration: 500 });
    $("#imgArrow").attr("src", "../theImages/"+img+".png");
  }

  function showHideContent () {
    var currVal = sessionStorage.getItem('showSlideArea');  
    if (currVal === 'false') {
        showContent( 'close');
        currVal='true';
    } else {
        showContent( 'open');
        currVal='false';
    }
    sessionStorage.setItem('showSlideArea', currVal);
  }

  $('#slideClick').on('click', showHideContent);

  var currVal = sessionStorage.getItem('showSlideArea');  
  if (currVal === 'true') {
    showContent('close');
  }
});