Q. How to create a cookies

Hey Charles...

Creating a cookie with JavaScript is fairly easy.  There isn't  much to do.  I'll try to explain the process of setting it up here.  You should be able to make it work.

First, the code.  You can break the code up into three functions -- one to create the cookie, one to read it, and one to erase it.  You probably don't even need the erase function, but I'm adding it for the sake of being complete.

Here are the functions:

<script type="text/javascript">
function createCookie(name, value, days) {
 if (days) {
   var date = new Date();
   date.setTime(date.getTime()+(days*24*60*60*1000));
   var expires = "; expires="+date.toGMTString();
   }
 else var expires = "";
 document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
 var ca = document.cookie.split(';');
 var nameEQ = name + "=";
 for(var i=0; i < ca.length; i++) {
   var c = ca[i];
   while (c.charAt(0)==' ') c = c.substring(1, c.length); //delete spaces
   if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
   }
 return null;
}

function eraseCookie(name) {
 createCookie(name, "", -1);
}
</script>

The names explain all you need to know about their working.  

In the following example, I'm going to create a cookie with the variable key "image_viewed" and give it a value of yes.  It's a common misnomer that there are multiple "cookies" per site.  That's actually not correct.  There is usually only one text file (called a cookie) with multiple values in it.  So, this script shouldn't interfere with your other scripts (assuming you pick unique identifiers).  

The code to CREATE the cookie is as follows:

createCookie('image_viewed', 'yes', 1);

Here, we're creating a cookie called 'image_viewed', setting its value to 'yes' and saying that it expires after 1 day.  You can change these as desired.


The following code would read the value of the cookie, and if it is set to anything but 'yes' (meaning that the image has not been viewed), it will show an image.

<script type="text/javascript">
  var x = readCookie('image_viewed');
  if (x != "yes") {
     document.open();
     document.write('<img src="image.jpg">');
     document.close();
  }
</script>

To see this in action, visit http://www.visualbinary.net/files/tutorials/cookies.  You can view source to see how the code is set up and/or copy a more formatted source.

Visit the page, you should see an image.
Refresh and the image will be gone.
Click on "CLEAR COOKIES" which will delete the cookie
Now refresh again, the image will be there.

--------------------------
Answer:- Hey Charles...

Creating a cookie with JavaScript is fairly easy.  There isn't  much to do.  I'll try to explain the process of setting it up here.  You should be able to make it work.

First, the code.  You can break the code up into three functions -- one to create the cookie, one to read it, and one to erase it.  You probably don't even need the erase function, but I'm adding it for the sake of being complete.

Here are the functions:

<script type="text/javascript">
function createCookie(name, value, days) {
 if (days) {
   var date = new Date();
   date.setTime(date.getTime()+(days*24*60*60*1000));
   var expires = "; expires="+date.toGMTString();
   }
 else var expires = "";
 document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
 var ca = document.cookie.split(';');
 var nameEQ = name + "=";
 for(var i=0; i < ca.length; i++) {
   var c = ca[i];
   while (c.charAt(0)==' ') c = c.substring(1, c.length); //delete spaces
   if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
   }
 return null;
}

function eraseCookie(name) {
 createCookie(name, "", -1);
}
</script>

The names explain all you need to know about their working.  

In the following example, I'm going to create a cookie with the variable key "image_viewed" and give it a value of yes.  It's a common misnomer that there are multiple "cookies" per site.  That's actually not correct.  There is usually only one text file (called a cookie) with multiple values in it.  So, this script shouldn't interfere with your other scripts (assuming you pick unique identifiers).  

The code to CREATE the cookie is as follows:

createCookie('image_viewed', 'yes', 1);

Here, we're creating a cookie called 'image_viewed', setting its value to 'yes' and saying that it expires after 1 day.  You can change these as desired.


The following code would read the value of the cookie, and if it is set to anything but 'yes' (meaning that the image has not been viewed), it will show an image.

<script type="text/javascript">
  var x = readCookie('image_viewed');
  if (x != "yes") {
     document.open();
     document.write('<img src="image.jpg">');
     document.close();
  }
</script>

To see this in action, visit http://www.visualbinary.net/files/tutorials/cookies.  You can view source to see how the code is set up and/or copy a more formatted source.

Visit the page, you should see an image.
Refresh and the image will be gone.
Click on "CLEAR COOKIES" which will delete the cookie
Now refresh again, the image will be there.