JavaScript - Code Works In Chrome, But Not Ie :(

Hey Everyone,

I have a simple Java Script function I setup for a pop up that requests a discount code. Works awesome in Chrome, FF and on smart phones... but IE and Safari don't work at all.

Here is the code..

This is in my header

<script>
function passWord1018() {
var testV = 1;
var pass1 = prompt('Please Enter The Discount Code',' ');
while (testV < 3) {
if (!pass1)
history.go(-1);
if (pass1.toLowerCase() == "ultra") {
alert('Code Accepted! Press Ok To Be Redirected To The Discounted Price Page');
window.open('discounted101018.aspx');
break;
}
if (pass1.toLowerCase() == "sexydiscount") {
alert('Code Accepted! Press Ok To Be Redirected To The Discounted Price Page');
window.open('discounted201018.aspx');
break;
}
testV+=1;
var pass1 =
prompt('Code Denied - Code Incorrect, Please Try Again.','Code');
}
if (pass1.toLowerCase()!="password" & testV ==3)
history.go(-1);
return " ";
}
</script>

This is in the body

<center>
<form>
<br />
<input type="button" value="Enter Discount Code" onclick="passWord1018()" />
</form>
</center>

I found on another site where someone mentioned the <center> tags are not used anymore, but i tried removing those and still nothing...

Any insight would be helpful...Thanks

Jason

Can anyone tell me why the following works in IE but not the other browsers?

It's the "Select category..." jump menu at this URL: www.savasbeatie.com/books.htm

Code:

<TD>
	                  <form name="whichCat" style="margin-bottom:0" method="get">
                        <select name="catChoice" onChange="sendValue(this);">
                          <option class="news4" value="javascript:location.reload(true)" selected>Select Category...</option>
                          <option class="news4" value="php/IraqWars.php?q=Iraq%20Wars">Iraq Wars/Current Affairs</option>
						  <option class="news4" value="php/AncientHistory.php?q=Ancient%20History">Ancient History</option>
                          <option class="news4" value="php/AmericanRevolution.php?q=American%20Revolution">American Revolution</option>
                          <option class="news4" value="php/NapoleonicWar.php?q=Napoleonic%20War">Napoleonic War</option>
                          <option class="news4" value="php/AmericanCivilWar.php?q=American%20Civil%20War">American Civil War</option>
                          <option class="news4" value="php/IndianWars.php?q=Indian%20Wars">Indian Wars</option>
                          <option class="news4" value="php/WorldWars.php?q=World%20Wars">World Wars</option>
                          <option class="news4" value="php/Naval.php?q=Naval">Naval</option>
                          <option class="news4" value="php/MilitaryScience.php?q=Military%20Science">Military Science</option>
                          <option class="news4" value="php/SportsHistory.php?q=Sports%20History">Sports History</option>
                          <option class="news4" value="php/Other.php?q=Other">Other</option>
                        </select>
                      </form>
                    </TD>

I've been called in to help with this, but did not build the site. There's a frame that's supposed to display the link contents, and it's returning the error:

Error: document.getElementById("SB_Frame") is null
Source File: http://savasbeatie.com/jscripts/SB_util.js
Line: 11

I think it has something to do with the ID of the frame, (from Googling the error and reading some other posts,) but can't figure out where to put the tag.

Thanks for any help. - David

The following script grabs a string (*.abc.org, e.g. from &sid=xyz.abc.org) from the current URL and changes it (to ABC:abc.org). Everything works perfectly in IE, but Firefox and Chrome appear to get themselves into an endless loop. When I check the URL, xyz.abc.org has successfully been changed to ABC:abc.org, but the page just seems to keep refreshing over and over.

Code:

var tomatch = /abc.org/i;
var usrString = document.referrer;
var is_a_match = tomatch.test(usrString);
var newString = document.URL.replace(/[a-z]*\.abc\.org/, "ABC:abc.org"); if (is_a_match) {
    window.location.replace(newString);
}

Any suggestions much appreciated.

[CODE]<script type="text/javascript" language="Javascript">
<!-- Hide script from older browsers

function toggleMenu(currMenu) {
if (document.getElementById) {
thisMenu = document.getElementById(currMenu).style
if (thisMenu.display == "block") {
thisMenu.display = "none"
}
else {
thisMenu.display = "block"
}
return false
}
else {
return true
}
}

// End hiding script -->
</script> [CODE]

[CODE]<a href="javascript:void(0);" onclick="return toggleMenu('menu3')">Title</a>[CODE]

It freezes in Internet Explorer; but works fine in Chrome.

ok so ive nearly finished the animated javascript in my site.
http://calumk.com/

to see the effect launch in chrome or safari, it works fine..
but its not working in Firefox
(and i havent tested IE.. if someone could, i would appreciate it)

i have no-idea why.. .
im using the http://berniecode.com/writing/animator.html library
which works fine in all browsers..

Any help would be apreciated...

I would post the code, but its probably easier if you just view source

Title explains it really. The button I am using working perfecting in FireFox and Chrome but not in Internet explorer. (Yes I know someone that actually uses IE that pointed this out to me) The rest of the code works fine but just not the reset button I have. Something I have been needing to do is make the code call my images differently by putting them in an array so I don't mess this the sources of my images like I sloppily am here, but I am not sure if that will actually fix the problem I am have.

The checkbox should both uncheck the box(if checked) AND change the picture but it only unchecks the box.
Here is the relevant code let me know if you want me to post the whole thing.

Code:

function reset(){
		cb1.checked=false;
		document.goodAfternoon.src=goodAfternoonFinal.src; 
	}

Code:

"Check" me out;) <input type="checkbox" id="cb1" onClick="validate()" />
 <img src="Good Afternoon.gif" name="goodAfternoon">
 <input type="button" id="cb2" value="RESET" onClick="reset()"/>

Hi,

This code uses the getElementById to change the background of certain <tr>'s.

In a nutshell there are two buttons, the code checks which one has been clicked, then checks the background colour of a relevant <tr> and depending what it finds changes the colours of the cells.

Works fine in Chrome and Firefox but not in IE and I'm now sorely vexed by it.

Can anyone shed light on the solution please?

Code:

<script language="javascript" type="text/javascript">
        function changeBackgroundColor(objDivID)
        {
            var backColor = new String();

		if ( objDivID == "lifesciences" ) 
		
		{
            backColor = document.getElementById('claire').style.backgroundColor;
		}
		
		if ( objDivID == "healthcare" ) 
		
		{
			backColor = document.getElementById('adrienne').style.backgroundColor;
		}

		if(backColor.toLowerCase()=='#ffffff' || backColor.toLowerCase()=='rgb(255, 255, 255)')
            // IE works with hex code of color e.g.: #eeeeee
            // Firefox works with rgb color code e.g.: rgb(238, 238, 238)
            // Thats why both types are used in If-condition below
            
			{
			
			if ( objDivID == "lifesciences" )
					
        	{

                document.getElementById('david').style.backgroundColor = '#c0c0c0';
				document.getElementById('claire').style.backgroundColor = '#c0c0c0';
				document.getElementById('adrienne').style.backgroundColor = '#ffffff';
				document.getElementById('karen').style.backgroundColor = '#c0c0c0';
				document.getElementById('alice').style.backgroundColor = '#c0c0c0';
				document.getElementById('kelly').style.backgroundColor = '#ffffff';
				document.getElementById('sarah').style.backgroundColor = '#c0c0c0';
				document.getElementById('carolyn').style.backgroundColor = '#c0c0c0';
				document.getElementById('paul').style.backgroundColor = '#c0c0c0';
				document.getElementById('kayleigh').style.backgroundColor = '#c0c0c0';
				document.getElementById('tim').style.backgroundColor = '#c0c0c0';
				document.getElementById('chantal').style.backgroundColor = '#c0c0c0';
				document.getElementById('lee').style.backgroundColor = '#c0c0c0';
				document.getElementById('lisa').style.backgroundColor = '#c0c0c0';
				
			}
			
			else
			
			{

                document.getElementById('david').style.backgroundColor = '#c0c0c0';
				document.getElementById('claire').style.backgroundColor = '#ffffff';
				document.getElementById('adrienne').style.backgroundColor = '#c0c0c0';
				document.getElementById('karen').style.backgroundColor = '#c0c0c0';
				document.getElementById('alice').style.backgroundColor = '#c0c0c0';
				document.getElementById('kelly').style.backgroundColor = '#c0c0c0';
				document.getElementById('sarah').style.backgroundColor = '#c0c0c0';
				document.getElementById('carolyn').style.backgroundColor = '#ffffff';
				document.getElementById('paul').style.backgroundColor = '#ffffff';
				document.getElementById('kayleigh').style.backgroundColor = '#ffffff';
				document.getElementById('tim').style.backgroundColor = '#c0c0c0';
				document.getElementById('chantal').style.backgroundColor = '#c0c0c0';
				document.getElementById('lee').style.backgroundColor = '#c0c0c0';
				document.getElementById('lisa').style.backgroundColor = '#c0c0c0';
			}
			
            }
            else
			
			{

                document.getElementById('david').style.backgroundColor = '#ffffff';
				document.getElementById('claire').style.backgroundColor = '#ffffff';
				document.getElementById('adrienne').style.backgroundColor = '#ffffff';
				document.getElementById('karen').style.backgroundColor = '#ffffff';
				document.getElementById('alice').style.backgroundColor = '#ffffff';
				document.getElementById('kelly').style.backgroundColor = '#ffffff';
				document.getElementById('sarah').style.backgroundColor = '#ffffff';
				document.getElementById('carolyn').style.backgroundColor = '#ffffff';
				document.getElementById('paul').style.backgroundColor = '#ffffff';
				document.getElementById('kayleigh').style.backgroundColor = '#ffffff';
				document.getElementById('tim').style.backgroundColor = '#ffffff';
				document.getElementById('chantal').style.backgroundColor = '#ffffff';
				document.getElementById('lee').style.backgroundColor = '#ffffff';
				document.getElementById('lisa').style.backgroundColor = '#ffffff';
				
			}
			
		}
            

    </script>

I am pretty new to Javascript having a bit of a problem with a website with Google Maps integrated. URL is http://beta.5vanmap.com. JS is in /js/map.js.

I have two checkboxes (ccCheck and caccCheck). The basis is when the box is ticked, it overlays a KML onto the map.

This is working fine in Chrome, but in FF and IE it doesn't work, IE returns 'ccCheck is Undefined'. The code I am using is in the JS file, the bit it gets stuck at is as follows:

Code:

document.getElementById('ccCheck').onclick = function() {
	
				  if (ccCheck == 1)
  {
	ccCheck = 0;
   ccOverlay.setMap(null);  
  }

  else

  {
   ccCheck = 1;
	ccOverlay.setMap(map);    
  }


}

If I stick a ccCheck = document.getElementById('ccCheck') within the onclick function (before the if statement), it places the overlay onto the map, but then when I untick the box it just stays there.

It's such a simple thing (I think), and must be down to IE being pedantic about declaring the variable properly, the question is how should I be doing this?

Thanks and regards
Noel

I am using javascript to change the buttons on my website so that they load up a different image when hot spots on the buttons are hovered over.

Everything has been working great, but this morning I tried checking out my site and for some reason the javascript wasn't working in Chrome, or on my iphone using Safari.
I tried it in IE and everything still works.

Any ideas on why it would stop working for those two browsers?

Here is the javascript:

Code:

 
function init(){
	
	document.getElementsByTagName('area')[0].onmouseover=function(){
		document.getElementById('crocodileImg').src='Images/crocodileHover.png';	
			this.onmouseout=function() {	
		document.getElementById('crocodileImg').src='Images/crocodile.png';
		}
	}
	
	document.getElementsByTagName('area')[1].onmouseover=function(){		
		document.getElementById('historyImg').src='Images/historyHover.jpg';
			this.onmouseout=function() {
		document.getElementById('historyImg').src='Images/history.jpg';
		}
	}
	
	document.getElementsByTagName('area')[2].onmouseover=function(){
		document.getElementById('applyImg').src='Images/applyHover.jpg';
			this.onmouseout=function() {
		document.getElementById('applyImg').src='Images/apply.jpg';
		}
	}
	
	document.getElementsByTagName('area')[3].onmouseover=function(){		
		document.getElementById('applyImg').src='Images/membersHover.jpg';
			this.onmouseout=function() {
		document.getElementById('applyImg').src='Images/apply.jpg';
		}
	}

	document.getElementsByTagName('area')[4].onmouseover=function(){
		document.getElementById('mediaImg').src='Images/mediaHover.jpg';
			this.onmouseout=function() {
		document.getElementById('mediaImg').src='Images/media.jpg';
		}
	}	
}

if(window.addEventListener){
	window.addEventListener('load',init,false);
}

else { 
	if(window.attachEvent){
	window.attachEvent('onload',init);
	}
}

I'm not sure if seeing the html the js is referencing will help at all, but here it is just in case:

Code:

        <div id="crocodile">
            <img id="crocodileImg" src="Images/crocodile.png" usemap="#crocodileImg" border="0" width="436" height="147" alt="Home" />
            <map id="crocodileImg" name="crocodileImg">
            <area id="crocArea" shape="poly" coords="41,9,23,21,20,58,40,78,72,78,82,86,88,112,117,129,140,126,257,126,274,107,274,79,401,78,420,66,419,26,404,6,369,7,366,0,294,0,291,7," href="index.html" alt="Home" title="Home" /> 	 
            </map>   
        </div>
        
        <div id="history">
            <img id="historyImg" src="Images/history.jpg" usemap="#historyImg" border="0" width="350" height="256" alt="Home" />
            <map id="historyImg" name="historyImg">
            <area id="historyArea" shape="poly" coords="18,77,18,167,48,170,79,208,124,233,174,238,228,218,257,188,266,176,280,184,306,182,338,102,331,93,271,92,254,54,226,27,196,11,169,4,137,7,109,17,82,33,65,51,52,74," href="history2.html" alt="History" title="History" />
            </map>             
        </div>
        
       
        <div id="apply">
            <img id="applyImg" src="Images/apply.jpg" usemap="#applyImg" border="0" width="280" height="223" alt="Apply" />
            <map id="applyImg" name="applyImg">
            <area id="applyArea" shape="poly" coords="17,43,17,57,15,72,20,84,39,83,43,79,56,76,62,62,65,49,77,42,76,36,70,22,65,14,52,14,45,21,38,24,31,32," href="apply.html" alt="Apply" title="Apply" />
            <area id="membersImg" shape="poly" coords="112,49,97,55,77,71,64,89,61,99,47,104,44,123,44,149,46,164,57,168,70,172,82,186,102,197,125,206,146,208,168,201,188,189,201,177,208,166,231,165,254,165,260,150,262,133,262,113,254,97,238,95,221,97,213,97,205,85,197,74,183,63,172,55,159,51,145,48,134,47,"href="members.html" alt="Members" title="Members" />
            </map>           
        </div>
        
        <div id="media">
             <img id="mediaImg" src="Images/media.jpg" usemap="#mediaImg" border="0" width="182" height="149" alt="Media" />
            <map id="mediaImg" name="mediaImg">
            <area id="mediaArea" shape="poly" coords="0,102,16,103,26,117,44,129,67,133,92,128,108,115,118,102,165,102,170,88,173,65,172,52,161,49,141,49,132,42,121,42,110,30,96,22,76,16,60,14,44,18,30,29,19,36,13,48,0,51," href="media.html" alt="Media" title="Media" />
            </map>       
        </div>

Thank you for any replies.

Hey all,

I have this code, that saves the "play" or "pause" audio-tag state in a cookie for recognizing on different pages.
This code only works properly in Chrome, but not in other browsers.
In IE, it doesn't save/recognize the cookies, apparently.
And in Firefox, I don't even get the audio to play.

Code:

$(document).ready(function(){
			
if ($.cookie("audioState") == "pause") {
	$("p#sound audio").get(0).pause();
	$("p#sound span#sound-icon").css({backgroundPosition: "0 -37px"});
}
else if ($.cookie("audioState") == "play") {
	$("p#sound audio").get(0).play();
	$("p#sound span#sound-icon").css({backgroundPosition: "0 0"});
}

$("p#sound").click(function() {
	var song = $(this).find("audio").get(0);
	var soundIcon = $(this).find("span#sound-icon");
	if (song.paused) {
		song.play();
		soundIcon.css({backgroundPosition: "0 0"}).hide().stop(1, 1).fadeIn(500);
		$.cookie("audioState", "play");
	} else {
		song.pause();
		soundIcon.css({backgroundPosition: "0 -37px"}).hide().stop(1, 1).fadeIn(500);
		$.cookie("audioState", "pause");
	}
});
				
});

Code:

<p id="sound">MUSIC <span id="sound-icon"></span>
	<audio autoplay="autoplay" loop="loop">
		<source src="audio/Breather2000-Afterlife.ogg" type="audio/ogg" />
		<source src="audio/Breather2000-Afterlife.mp3" type="audio/mp3" />
		Your browser does not support the audio tag.
	</audio>
</p>

What am I doing wrong?

Thanks already!

this page will display new images when you mouseover the red and orange arrows on the menu on the right side in chrome, but not ff, ie, opera, and safari. Any ideas as to why these other browsers aren't running the code like chrome? guessing this is javascript related - anyone want to offer any clues?

hi everyone, this is my 1st post here in this community forum, just would like to say "HI" to everyone.

i would like to share with you my experience in developing multiple dependency selection form developed in java script, how this script works is that when 1st selection is selected, based on the value the user select, a second level selection will appear and so on.

below is the Java-script code along with my form code too

Javascript:
<script type="text/javascript">

function nextSelect(o) {

if (o.value == '0') {
var next = o.nextSibling;
while (next && next.nodeName != 'SELECT') {
next = next.nextSibling;
}
next.length = 0;

return;
}
var d = document;

var useSelect = d.getElementById(o.name + '_' + o.value);

if (!useSelect) {
alert('Unknown id: ' + o.name + '_' + o.value);
return;
}

var copy = useSelect.cloneNode(true);
copy.style.display = 'inline';

var next = o.nextSibling;
while (next && next.nodeName != 'SELECT') {
next = next.nextSibling;
}
next.parentNode.insertBefore(copy, next);
next.parentNode.removeChild(next);
}
</script>

my form:
<div style="display: none;">

<!-- ##### First Selection ####### -->

<select name="second" id="first_dp" onchange="nextSelect(this);">
<option value="0">Choose</option>
<option value="dp_2_38">2 3/8'</option>
<option value="dp_4">4'</option>
</select>

<select name="second" id="first_hw" onchange="nextSelect(this);">
<option value="0">Choose</option>
<option value="hw_3_12">3 1/2'</option>
<option value="hw_4">4'</option>
</select>

<!-- ####### 2nd Selection ####### -->

<select name="third" id="second_dp_2_38" onchange="nextSelect(this);">
<option value="0">Choose</option>
<option value="dp_2_38_4.85">4.85 lbs/ft</option>
<option value="dp_2_38_6.65">6.65 lbs/ft</option>
</select>
<select name="third" id="second_dp_2_78" onchange="nextSelect(this);">
<option value="0">Choose</option>
<option value="dp_2_78_6.85">6.85 lbs/ft</option>
<option value="dp_2_78_10.4">10.4 lbs/ft</option>
</select>

>>>>>>and so on till 3rd selection<<<<<<<<<

</div>

<form action="pdfHandle.php" method="post" id="pdfsearch">
<fieldset>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="142" height="146">
<p>
Type:<br />
Size:<br />
Weight:<br />
</td>
<td width="266"><select name="first" onclick="nextSelect(this);">
<option value="0">Choose</option>
<option value="dp">Drill Pipe</option>
<option value="hw">Heavy Weight</option>
</select><br/>
<select name="select">
</select>
<br/>
<select name="select">
</select>
<br/>
<select name="select">
</select>

</td>
</tr>
</table>
<p>
<input type="submit" name="submit" id="submit" value="Create PDF" />
<input type="reset" value="Reset Selection" />
</p>
</fieldset>
</form>
-----------------------------------------------------------------------

i would like to know what i am missing here and what is making Safari n chrome not to run this page properly, when u execute this code, only the 1st selection will appear while the rest of the selections are Null, i hope someone will guide me through this or direct me to solution or any other way of doing this perhaps

i thank you for viewing this post.

I am ripping my hair out trying to figure out why my innerHTML code is not working. It only works in IE, but keeps failing in Chrome and Firefox. I am using a form text field for customers to enter a Gallery ID (text value in the form field) which I have set up for them in an external js file.

I use this code to change the content of div's after it checks the js file for a matching text value. Here is what is happening-- the proper content shows up for a second in Chrome or Firefox if the username value matches, but it pops away really fast and goes back to the login field prompt.

Javascript:

Code:

<head>

<script type="text/javascript">
function setinitialvalues(){
document.getElementById('loginblock').style.visibility = 'visible';
document.getElementById('galleryinfo2').style.visibility = 'hidden';
document.getElementById('expiredmessage').style.visibility = 'hidden';
document.getElementById('republish').style.visibility = 'hidden';
document.getElementById('logoutmessage').innerHTML = "";
document.getElementById('logoutmessage2').innerHTML = "";
document.getElementById('logoutmessage').style.visibility = 'hidden';
document.getElementById('logoutmessage2').style.visibility = 'hidden';
}
</script>

<script type="text/javascript">
  function loadcustomer(){
  document.getElementById('galleryinfo').innerHTML = "";
  document.getElementById('galleryinfo2').innerHTML = "";
  document.getElementById('expdatemessage').innerHTML = "";
  document.getElementById('expiredmessage').innerHTML = "";
  document.getElementById('republish').innerHTML = "";
  document.getElementById('logoutmessage').style.visibility = 'hidden';
  document.getElementById('logoutmessage2').style.visibility = 'hidden';
  document.getElementById('loginblock').innerHTML = "<br /><h4>If you know your Gallery ID, you can enter it here to access your proofing gallery and order page.<br /><br />ENTER GALLERY ID:</h4><form name='form' action='' method='post'><input style='color:#000;' name='username' id='username' onfocus='clearinvalid()' onKeyDown='clearinvalid()'><br /><br /><input style='background-color:#33A1C9;' class='button' id='submitbutton' type='submit' value='Submit' onClick='return galleryid(this.form)'></form><h4><div style='color:#ff0000;' id='invalidmessage'></div></h4><br />Sample Gallery ID: demo<br />(Then click the Submit button. Some browsers do not accept the Enter key.)<br /><br /><a href='#' class='btn btn-lg btn-default'>Back to Menu</a><br /><br />This works on Internet Explorer, Firefox, Opera and Google Chrome. Please use one of these web browsers to log in.";
  document.getElementById('loginblock').style.visibility = 'visible';
  }
</script>	
		
<script language="javascript" type="text/javascript" src="customergallery.js"></script>		

</head>

HTML:

Code:

<div style="text-align:center;" id="loginblock"></div>
<div id="galleryinfo"></div>
<div id="galleryinfo2"></div>
<div style="color:#ff0000;" id="expdatemessage"></div>
<div style="color:#ff0000;" id="expiredmessage"></div>
<div id="republish"></div>
<div id="logoutmessage"></div>
<div id="logoutmessage2"></div>

External customer js file:

Code:

function Submit(){
   if(event.keyCode == 13)
  {
	galleryid();
	return false;
  }
}
function galleryid(){

if (document.getElementById('username').value == 'demo') {
var name = "My Photomatic Photo Session";
var sessiondate = "02/22/2014";
var location = "Any town, USA";
var orderlink = "<a href='../../accounts/brown/20140222/myphotomatic20140222.html' target='_blank'>CLICK HERE TO VIEW GALLERY</a>";
var todayDate = new Date();
var expdate = new Date(2015,05,30);
comparedate();
}

else if (document.getElementById('username').value == '') {
document.getElementById('invalidmessage').innerHTML = 'Please enter a value in this field.';
}

else {
document.getElementById('invalidmessage').innerHTML = 'Invalid Gallery ID. Please try again.';
}
document.getElementById('username').value = "";
return false;

function comparedate() {
if (todayDate >= expdate)
{
document.getElementById('galleryinfo2').innerHTML = "<br /><br />" + name + "<br />Session Date: " + sessiondate + "<br />" + location + "<br /><br />";
document.getElementById('expiredmessage').innerHTML = "This gallery has expired on " + (expdate.getMonth()+1) + "/" +  expdate.getDate() + "/" + expdate.getFullYear();
document.getElementById('republish').innerHTML = "<br />If you would like to have this gallery republished, please email me .<br /><br />";
document.getElementById('logoutmessage2').innerHTML = "<a href='javascript:void(0);' onclick='loadcustomer(); clearusername(); setinitialvalues();' class='btn btn-lg btn-default'>Click here to return to the Login</a><br /><br />";
document.getElementById('galleryinfo2').style.visibility = 'visible';
document.getElementById('expiredmessage').style.visibility = 'visible';
document.getElementById('republish').style.visibility = 'visible';
document.getElementById('logoutmessage2').style.visibility = 'visible';
document.getElementById('loginblock').innerHTML = "";
document.getElementById('loginblock').style.visibility = 'hidden';
}
else {
loadcustomer();
document.getElementById('galleryinfo').innerHTML = "<br /><br />" + name + "<br />Session Date: " + sessiondate + "<br />" + location + "<br /><br />" + orderlink + "<br /><br />";
document.getElementById('expdatemessage').innerHTML = "This gallery will expire on " + (expdate.getMonth()+1) + "/" +  expdate.getDate() + "/" + expdate.getFullYear() + ".<br /><br />";
document.getElementById('logoutmessage').innerHTML = "<a href='javascript:void(0);' onclick='loadcustomer(); clearusername(); setinitialvalues();' class='btn btn-lg btn-default'>Click here to return to the Login</a><br /><br />";
document.getElementById('logoutmessage').style.visibility = 'visible';
document.getElementById('loginblock').innerHTML = "";
document.getElementById('loginblock').style.visibility = 'hidden';
}
}

}

function clearinvalid(){
document.getElementById('invalidmessage').innerHTML = '';
}
function clearusername(){
document.getElementById('username').value = "";
}

Where am I going wrong and what can I do to make this work in Chrome and Firefox? It works great in IE. Thanks!

Ok guys if you look at this page www.runningprofiles.com/members/shout/view.php my code works great....

But when i add it to the rest of the script the code wont work shows he
http://www.runningprofiles.com/membe...ll_Script.php#


Below is view.php (the one that works)
and the one added to the code scirpt is the one the does not.


PHP Code:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() 
{
$(".view_comments").click(function() 
{
var ID = $(this).attr("id");

$.ajax({
type: "POST",
url: "viewajax.php",
data: "msg_id="+ ID, 
cache: false,
success: function(html){
$("#view_comments"+ID).prepend(html);
$("#view"+ID).remove();
$("#two_comments"+ID).remove();
}
});
return false;
});
});
</script>





<ol>
<?php

//Here $id is main message msg_id value.
$csql=mysql_query("select * from comments where msg_id_fk='130' order by com_id ");
$comment_count=mysql_num_rows($csql);
if($comment_count>2)
{
$second_count=$comment_count-2;
?>


<div class="comment_ui" id="view130">
<a href="#" class="view_comments" id="130">View all <?php echo $comment_count; ?> comments</a>
</div>


<?php 
} 
else 
{
$second_count=0;
}
?>




<div id="view_comments130"></div>
<div id="two_comments130">




<table width="30%">
<?php
$small=mysql_query("select * from comments where msg_id_fk='130' order by com_id limit $second_count,2 ");
while($rowsmall=mysql_fetch_array($small))
{ 
$c_id=$rowsmall['com_id'];
$comment=$rowsmall['comment'];
?>


<div class="comment_actual_text">



<tr>
    <td style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid" valign="top">
                   


 <table style="WIDTH: 100%; BORDER-COLLAPSE: collapse" align="left">
                     <tr>

                 <td width="5%" style="VERTICAL-ALIGN: middle; TEXT-ALIGN: center"><img style="WIDTH: 30px; HEIGHT: 30px" alt="srinivas" src="http://www.gravatar.com/avatar.php?gravatar_id=7a9e87053519e0e7a21bb69d1deb6dfe" border="1" /></td>
                 <td style="VERTICAL-ALIGN: top; TEXT-ALIGN: left">
                   <strong>Jarratt</strong> <?php echo $comment; ?>
                   <br /><span style="COLOR: #a9a9a9">10 min ago - ID = <?php echo $c_id;?> </span></td>
            
</tr> 
</table><br />
      </td>
  </tr>








</div>
<?php } ?>
</table>
</div>
</ol>

Facebook_Wall_Script.php

PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>9lessons Applicatio Demo</title>
<link href="frame.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery.oembed.js"></script>
 
 <script type="text/javascript">
<script type="text/javascript">
$(function() 
{
$(".view_comments").click(function() 
{
var ID = $(this).attr("id");

$.ajax({
type: "POST",
url: "../viewajax.php",
data: "msg_id="+ ID, 
cache: false,
success: function(html){
$("#view_comments"+ID).prepend(html);
$("#view"+ID).remove();
$("#two_comments"+ID).remove();
}
});
return false;
});
});



$(function() {

$(".comment_button").click(function() {

var element = $(this);
   
    var boxval = $("#content").val();
    
    var dataString = 'content='+ boxval;
    
    if(boxval=='')
    {
    alert("Please Enter Some Text");
    
    }
    else
    {
    $("#flash").show();
    $("#flash").fadeIn(400).html('<img src="ajax.gif" align="absmiddle">&nbsp;<span class="loading">Loading Update...</span>');
$.ajax({
        type: "POST",
  url: "update_ajax.php",
   data: dataString,
  cache: false,
  success: function(html){
 
  $("ol#update").prepend(html);
  $("ol#update li:first").slideDown("slow");
  
   document.getElementById('content').value='';
   $('#content').value='';
   $('#content').focus();
  $("#flash").hide();
  
    
    $("#expand_url").oembed(boxval);
    
  }
 });
}
return false;
    });


/ Delete Wall Update

$('.delete_update').live("click",function() 
{
var ID = $(this).attr("id");
var dataString = 'msg_id='+ ID;
var parent=$("#bar"+ID);
    jConfirm('Are you sure you want to delete this message?', 'Confirmation Dialog', 
                
                    function(r) {
                    
                    
                    if(r==true)
                    {
$.ajax({
        type: "POST",
  url: "delete_update.php",
   data: dataString,
  cache: false,
  success: function(html){
 
 
    parent.slideUp(300,function() { parent.remove(); });
  }
 });

}
});
return false;
});//comment slide
$('.comment').live("click",function() 
{

var ID = $(this).attr("id");
$(".fullbox"+ID).show();
$("#c"+ID).slideToggle(300);

return false;
});


//commment Submint

$('.comment_submit').live("click",function() 
{

var ID = $(this).attr("id");

var comment_content = $("#textarea"+ID).val();
    
    var dataString = 'comment_content='+ comment_content + '&msg_id=' + ID;
    
    if(comment_content=='')
    {
    alert("Please Enter Comment Text");
    
    }
    else
    {
    
   
       $.ajax({
        type: "POST",
  url: "comment_ajax.php",
   data: dataString,
  cache: false,
  success: function(html){
  
 
  $("#commentload"+ID).append(html);
    document.getElementById("textarea"+ID).value='';
   
   $("#textarea"+ID).focus();
  
  }
 });
    
    
    }

return false;
});

// Delete Wall Update

$('.delete_update').live("click",function() 
{
var ID = $(this).attr("id");
var dataString = 'msg_id='+ ID;
var parent=$("#bar"+ID);
    jConfirm('Are you sure you want to delete this message?', 'Confirmation Dialog', 
                
                    function(r) {
                    
                    
                    if(r==true)
                    {
$.ajax({
        type: "POST",
  url: "delete_comment.php",
   data: dataString,
  cache: false,
  success: function(html){
 
 $("#comment"+ID).slideUp();
    
  }
 });
}
return false;
});




return false;

});


</script>


<style type="text/css">
body
{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
.update_box
{
background-color:#D3E7F5; border-bottom:#ffffff solid 1px; padding-top:3px
}
a
    {
    text-decoration:none;
    color:#d02b55;
    }
    a:hover
    {
    text-decoration:underline;
    color:#d02b55;
    }
    *{margin:0;padding:0;}
    
    
    ol.timeline
    {list-style:none;font-size:1.2em;}ol.timeline li{ display:none;position:relative; }ol.timeline li:first-child{border-top:1px dashed #006699;}
    .delete_button
    {
    float:right; margin-right:10px; width:20px; height:20px
    }
    
    .cdelete_button
    {
    float:right; margin-right:10px; width:20px; height:20px
    }
    
    .feed_link
    {
    font-style:inherit; font-family:Georgia; font-size:13px;padding:10px; float:left; width:350px
    }
    .comment
    {
    color:#0000CC; text-decoration:underline
    }
    .delete_update
    {
    font-weight:bold;
    
    }
    .cdelete_update
    {
    font-weight:bold;
    
    }
    .post_box
    {
    height:55px;border-bottom:1px dashed #006699;background-color:#F3F3F3;  width:499px;padding:.7em 0 .6em 0;line-height:1.1em;
    
    }
    #fullbox
    {
    margin-top:6px;margin-bottom:6px; display:none;
    }
    .comment_box
    {
        display:none;margin-left:90px; padding:10px; background-color:#d3e7f5; width:300px;  height:50px;
    
    }
    .comment_load
    {
      margin-left:90px; padding:10px; background-color:#d3e7f5; width:300px; height:30px; font-size:12px; border-bottom:solid 1px #FFFFFF;
    
    }
    .text_area
    {
    width:290px;
    font-size:12px;
    height:30px;
    }
    #expand_box
    {
    margin-left:90px;
    margin-top:5px;
    margin-bottom:5px;
    }
    embed
    {
        width:200px;
        height:150px;

    }
    
</style>
</head>

<body>
<?php include '../../../settings.php'; ?>

<div align="center">
<table cellpadding="0" cellspacing="0" width="500px">
<tr>
<td>


<div align="left">
<form  method="post" name="form" action="">
<table cellpadding="0" cellspacing="0" width="500px">

<tr><td align="left"><div align="left">
<h3>What are you doing?</h3></div></td></tr>
<tr>
<td style="padding:4px; padding-left:10px;" class="update_box">
<textarea cols="30" rows="2" style="width:480px;font-size:14px; font-weight:bold" name="content" id="content" maxlength="145" ></textarea><br />
<input type="submit"  value="Update"  id="v" name="submit" class="comment_button"/>
</td>

</tr>

</table>
</form>

</div>
<div style="height:7px"></div>
<div id="flash" align="left"  ></div>



<ol  id="update" class="timeline">
</ol>

<div id='old_updates'>
<?php
$small=mysql_query("select * from messages2 order by msg_id desc LIMIT 5");
while($r=mysql_fetch_array($small))
{ 
$id=$r['msg_id'];
$msg=$r['message'];

?>


<div align="left" class="post_box">
<span style="padding:10px"><?php echo $msg.'....'.$id; ?> </span>
</div>


<ol>
<?php
//Here $id is main message msg_id value.
$csql=mysql_query("select * from comments where msg_id_fk='$id' order by com_id ");
$array = mysql_fetch_assoc($csql);

$comment_count=mysql_num_rows($csql);
if($comment_count>2)
{
$second_count=$comment_count-2;
?>


<div class="comment_ui" id="view<?php echo $id; ?>">
<a href="#" class="view_comments" id="<?php echo $id; ?>">View all <?php echo $comment_count; ?> comments</a>
</div>
<?php 
}


?>


<div id="view_comments<?php echo $id; ?>"></div>
<div id="two_comments<?php echo $id; ?>">




<table width="50%">


<?php
$small2=mysql_query("select * from comments where msg_id_fk='$id' order by com_id limit 2 ");
while($rowsmall22=mysql_fetch_array($small2))
{ 
$c_id=$rowsmall22['com_id'];
$comments=$rowsmall22['comment'];
?>


<div class="comment_actual_text">



<tr>
    <td style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid" valign="top">
                   


 <table style="WIDTH: 100%; BORDER-COLLAPSE: collapse" align="left">
                     <tr>

                 <td width="5%" style="VERTICAL-ALIGN: middle; TEXT-ALIGN: center"><img style="WIDTH: 30px; HEIGHT: 30px" alt="srinivas" src="http://www.gravatar.com/avatar.php?gravatar_id=7a9e87053519e0e7a21bb69d1deb6dfe" border="1" /></td>
                 <td style="VERTICAL-ALIGN: top; TEXT-ALIGN: left">
                   <strong>Jarratt</strong> <?php echo $comments; ?>
                   <br /><span style="COLOR: #a9a9a9">10 min ago - ID = <?php echo $c_id.'...'.$id;?> </span></td>
        
</tr> 
</table><br />
    </td>
  </tr>








</div>
<?php } ?>
</table>
</div>
</ol>
<?php } ?>








</div>


</td>
</tr>
</table>






</div>
</body>
</html>

I'm new to the forum. So hi everyone.

The code below works fine on IE and FF but not on Google Chrome.
Can someone tell me where I'm doing wrong?

Thank you for your answers in advance. Im really looking forward much to hearing from you.

You can preview the below code by pasting it to Frontpage, Dreamweaver and etc.

Quote:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/JavaScript">

<!--
function show(id)
{
if (document.getElementById(id).style.display == 'none')
{
document.getElementById(id).style.display = '';
}
}
//-->

<!--
function hide(id)
{
document.getElementById(id).style.display = 'none';

}
//-->
</script>

</head>

<body>

<div>

<div>
<table cellspacing="1" cols="3" border="0">
<tbody>
<td><a onfocus="hide('tblB');hide('tblC');show('tblA');" href="#">A</a>
<td><a onfocus="hide('tblA');hide('tblC');show('tblB');" href="#">B</a>
<td><a onfocus="hide('tblB');hide('tblA');show('tblC');" href="#">C</a>
</td>
</tr>
</tbody>
</table>
</div>
<div>
<table id="tblA" style="DISPLAY: none" cols="1" cellpadding="2">
<tbody>
<tr valign="top" align="left">

<td>
You&nbsp;select A,
table
tblA is shown&nbsp;
</td>
</tr>
</tbody>
</table>
</div>
<div>
<table id="tblB" style="DISPLAY: none" cols="1" cellpadding="2">
<tbody>
<tr valign="top" align="left">
<td>
You&nbsp;select B, table tblB
is shown&nbsp;
</td>
</tr>
</tbody>
</table>
</div>
<div>
<table id="tblC" style="DISPLAY: none" cols="1" cellpadding="2">
<tbody>
<tr valign="top" align="left">
<td>
You&nbsp;select C, table tblC
is shown&nbsp;
</td>
</tr>
</tbody>
</table>

</div>
</div>
</body>
</html>