Scripts works with ie 7 but not with Netscape 8/Firefox 1.5

**novicemike** · 05-22-2007, 05:33 PM

I have two functions that work properly in IE 7. However, they will not execute in either Netscape 8 or Firefox 1.5.

I am using the two functions to determine which radio button has been selected and then using the DynamicDrive "Image Thumbnail Viewer II script" to show baby picture images.

Below are the functions, doctype, and the Form format I am using.

Please accept my thanks in advance for any and all assistance you can provide. Also, this is my first posting ... if there is a better way to post this type of issue let me know. Again, my thanks.

================================
var showing = "";
function doSelection(selection) {
if (selection == "Apr2007_1") {
showHideDiv("divApr2007_1");
} else if (selection == "Apr2007_2") {
showHideDiv("divApr2007_2");
} else if (selection == "May2007") {
showHideDiv("divMay2007");
} else if (selection == "Jun2007") {
showHideDiv("divJun2007");
//} else if (selection == "Jul2007") {
// showHideDiv("divJul2007");
//} else if (selection == "Aug2007") {
// showHideDiv("divAug2007");
//} else if (selection == "Sep2007") {
// showHideDiv("divSep2007");
//} else if (selection == "Oct2007") {
// showHideDiv("divOct2007");
//} else if (selection == "Nov2007") {
// showHideDiv("divNov2007");
//} else if (selection == "Dec2007") {
// showHideDiv("divDec2007");
}
}
function showHideDiv(div) {
if (showing != "") {
document.all(showing).style.display="none";
}
document.all(div).style.display="block"; showing=div;
}

================================

DOCTYPE is HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml">

================================

<table style="background-color:#fc3cc8;color:#ffffff;font-family:Verdana;font-size:14px;visibility: visable;" width="82%" border="0" cellspacing="0" cellpadding="0" border="0">
<form>
<label for="selection" class="select">Group Selections:   
<input type="radio" name="selection" value="Apr2007_1" onClick="doSelection('Apr2007_1')" />April 2007 - Hospital
<input type="radio" name="selection" value="Apr2007_2" onClick="doSelection('Apr2007_2')" />April 2007 - Home
<input type="radio" name="selection" value="May2007" onClick="doSelection('May2007')" />May 2007
<input type="radio" name="selection" value="Jun2007" onClick="doSelection('Jun2007')" />Jun 2007
</label>
</form>
</table><br>

========
Note: the following is just one of the tables used to set up the div selections
========

<table id="divApr2007_1" width="55%" border="0" style="display: none;">
<tr>
<td width="75%" align="center" valign="top" colspan="7">
<div id="loadarea_1" style="width:800px;height:600px;background-color:#ffd5f5;color:#850914;font-family:Verdana;font-size:16px"></div>
</td>
<td width="20%" align="left">
<a href="http://www.users.qwest.net/~emailmike/PICT0003.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title="Second Day Nap"><img border="0" src="http://www.users.qwest.net/~emailmike/PICT0003.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/PICT0004.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title="Second Day Nap"><img border="0" src="http://www.users.qwest.net/~emailmike/PICT0004.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/PICT0005.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/PICT0005.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/PICT0006.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/PICT0006.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/PICT0007.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/PICT0007.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/BabySofiaMarie048A.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/BabySofiaMarie048A.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/BabySofiaMarie049A.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/BabySofiaMarie049A.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/BabySofiaMarie050A.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/BabySofiaMarie050A.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/BabySofiaMarie051A.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/BabySofiaMarie051A.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
<a href="http://www.users.qwest.net/~emailmike/BabySofiaMarie052A.jpg" rel="enlargeimage::mouseover" rev="loadarea_1" title=""><img border="0" src="http://www.users.qwest.net/~emailmike/BabySofiaMarie052A.jpg" width="90" height="68" style="margin-bottom: 5px; margin-top:7px"></a><br />
</td>
</tr>
<tr height="20"></tr>
</table>

**Bob90** · 05-22-2007, 05:38 PM

A better way would be to encase the code in code tags. Go to edit post --> Advanced --> highlight all the code and press the # symbol. The words code in square brackets should then encompass your code. It looks a lot neater.

And...

If the page is online already, give us a link. It helps a lot with the analysis.

Heres the problem.

Code:

function showHideDiv(div) {
if (showing != "") {
document.all(showing).style.display="none";
}
document.all(div).style.display="block"; showing=div;
}

document.all is specific to IE only. Other browsers don't support it.

Instead, you should use the w3c standard, which is supported by most modern browsers

Code:

function showHideDiv(div) {
if (showing != "") {
document.getElementById(showing).style.display="none";
}
document.getElementById(div).style.display="block"; showing=div;
}

Hope this helped

p.s. see how the code tags make the code appear in a text box. Much neater.

**novicemike** · 05-22-2007, 06:13 PM

Thanks Bob ...

You accomplished in minutes something that I've been staring at for hours.

The page is not online yet. I've been attempting to get the scripts running within my little intranet development area prior to posting it on my internet web space.

Please know ... I truly appreciate your assistance.

**Bob90** · 05-22-2007, 06:38 PM

Everyone in this forum is here to help. I'm just one of them.

Thread: Scripts works with ie 7 but not with Netscape 8/Firefox 1.5

Thread Tools

Search Thread

Scripts works with ie 7 but not with Netscape 8/Firefox 1.5

Bookmarks

Bookmarks

Posting Permissions