why is this not working?? whats wrong with this snippet?

[antonyfal]

Im trying to toggle hide/show of 2 div's on a page based on if a cookie is available or not, This is not working just shows a blank on html page through browser view...

what is supposed to happen is: if the cookie exists, the online div must show, and the offline div should be hidden.... if there is no cookie, then the online should be hidden and the offline should show..

 

Here is my code:

 

// i use this to set a cookie:

<script language="javascript">

document.cookie = "letsChat= 1";

</script>

 

 

// this to check if exists... was given to me by Omiran...

 

<script type="text/javascript">

function isCookieSet(letsChat) {

var foo = document.cookie.split("=");

for (key in foo) {

if (foo[key] == letsChat) { return true };

}

return false;

}

</script>

 

//and this to hide show the html div's

 

<script type="text/javascript">

        var online = document.getElementById("online");

var offline = document.getElementById("offline");

if(isSetCookie("letsChat")){

    online.style.display = "vissible";

offline.style.display = "none";

  }

else {

    online.style.display = "none";

offline.style.display = "vissible";

}

</script>

 

 

// here is my html

<td>

<div id="online" style="display:none; width:89px; height:19px" ><a href="javascript:void(0);" onClick="window.open('{EMAIL2}', 'iframe', 'http://www.xxxxxxxx.com/subfolder/chat/{USERNAME}/{EMAIL2}/chat/xxxxxxx_window.html', '{EMAIL2}', 'width=224px,height=237px,resize=0,scrolling=0,center=1');"><font color="#ff0033"><b>CHAT ONLINE</b></font></a></div>

<div id="offline" style="display:none; width:89px; height:19px; background-color:transparent;"><font color="#ffffff"><b>CHAT OFFLINE</b></font><div>

  </td>

 

when i run the html through the browser there is just a blank nothing happens and there are no error messages either..

 

[Omirion]

hey again

 

Now that i see you made a little effort i can help you

You should go ahead and place this code

var online = document.getElementById("online");
   var offline = document.getElementById("offline");
   if(isSetCookie("letsChat")){
          online.style.display = "vissible";
      offline.style.display = "none";
     }
   else {
          online.style.display = "none";
      offline.style.display = "vissible";
   }

 

in the onReady function.

Syntax:

window.onload = function ()
{
  //thins happen here
} 

What this does is execute whatever is in the function when the Document is loaded.

 

Since you are calling your function when nothing has happened yet, you cannot expect it to work

 

Happy coding

[antonyfal]

Thanks Omiran.