JavaScript - Script And Firefox Problem

Nice for a change: a piece of code that does work in all versions of IE, but not in Firefox. I'm stuck.

Code:

<img alt="Loodgieters" title="Loodgieters" src="/core/loodgieters_uit.png" name="loodgieters" 
          border="0" style="margin-right:1px; margin-top:1px; float:left; cursor:pointer;" 
          onclick="document.location='/pages/loodgieters.php';" 
          onmouseover="foto1.style.backgroundColor='#392d63'; loodgieters.src='/core/loodgieters_aan.png'" 
          onmouseout ="foto1.style.backgroundColor='#008ac9'; loodgieters.src='/core/loodgieters_uit.png'" />

Explanation: element "loodgieters" is a menu button that should change on mouseover. It doesn't in FF, it does in IE.
Secondly, when you "mousover" the image, it should change the backgroundcolor of a second element (foto1).

Element 'foto1' is a table cell. In return, when you mouse-over this table cell, the image element 'loodgieters' should change as well. So it's a two-way thing. The code for the table cell is:

Code:

<td height="189" id="foto1" bgcolor="#008ac9" valign="top" 
	onmouseover="style.backgroundColor='#392d63'; loodgieters.src='/core/loodgieters_aan.png';" 
	onmouseout="style.backgroundColor='#008ac9';  loodgieters.src='/core/loodgieters_uit.png';" 
	style="cursor:pointer;" 
	onclick="document.location='/pages/loodgieters.php';">
	<img alt="Loodgieters" title="Loodgieters" src="/core/loodgieters.png" 
	style="border:0; margin-left:auto; margin-right:auto; margin-top:10px; display: block;" /></td>

Again: it all works as I expected in IE, Safari and Chrome, but it does not in Firefox.

The whole page validates as XHTML 1.0 Transitional
What am I overlooking here? I'm stuck. Any help is welcome

I'm a real novice and out of my depth with this, i hope someone can help.

I have a small script that searches a single page for a keyword, it works fine with IE, but will not work with Firefox.

Below is the code thats checks which browser is running and the action to take.

Code:
var NS4 = (document.layers);
var IE4 = (document.all);
var win = window;
var n = 0;
function findInPage(str) {
var txt, i, found;
if (str == "")
return false;
if (NS4) {
if (!win.find(str))
while(win.find(str, false, true))
n++;
else
n++;
if (n == 0)
alert("Not found.");
}
if (IE4) {
txt = win.document.body.createTextRange();
for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) {
txt.moveStart("character", 1);
txt.moveEnd("textedit");
}

Can anyone help me out with this problem.

Many thanks
Jasper

I have a script where the user selects an item on the main nav and it will display the sub-nav below. It works fine in every browser except Firefox. ANy ideas?

http://tinyurl.com/79wlwq3

EDIT: It's just that script that won't work, btw. I tested an alert box for Firefox and it works fine.

Right now, it only works with IE. This goes in the header...

Quote:
<script language="JavaScript1.2">

function makevisible(cur,which){
strength=(which==0)? 1 : 0.2

if (cur.style.MozOpacity)
cur.style.MozOpacity=strength
else if (cur.filters)
cur.filters.alpha.opacity=strength*100
}

</script>
and this goes in the image:

Quote:
<img style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" src="SOURCE OF IMAGE">
It works great in IE, but not firefox or chrome. Any way I can alter this to get it to work in all 3 or at least Firefox and IE.

Thanks for the help!

Hopefully this is a noob and simple question to answer, but I used this random ads script and modified it to show random boxarts for PS3 games..
http://javascript.internet.com/misce...andom-ads.html


You can see what I'm trying to do he
http://empireelite.org/index2.htm - (temporary page just for testing the code, refresh and see that the PS3 boxarts become randomized)


Everything looks perfect in Internet Explorer, but in Firefox it looks to have about 15px in spacing on both top and bottom. I know the table itself is fine, because everything fits fine on the real main page http://www.empireelite.org/


The pictures are also not overlapping the cell. It's 9 pics x 22 width, (198px in a 200px wide cell) and it has the same spacing even if I just have 1 pic there using the script.


Is there a code I can add or remove to get rid of the spacing in Firefox?


I already removed , spacing from this line:
function randomorder(targetarray, spacing) {

and removed +spacing from this line:
document.write(targetarray[the_one]+spacing)


Neither did anything and the script works the same way without those small pieces of code (I'm not sure what either of them did to begin with).



Here is the javascript page I'm using:
http://empireelite.org/randomAds.js

And also View Source in this test page:
http://empireelite.org/index2.htm

Hi,

I adjusted a javascript code which was a clickable popup to an autoloading popup. Basicly when someone visits the page I want the popup to appear. It's working fine but Firefox doesn't display the popup on page load, only when clicked. (newsletter signup) Im just starting out on JavaScript. Can anyone help?

here's the code

Code:

$(document).ready(function() {
					   
// Here we will write a function when link click under class popup				   

									
var rel = popuprel3;							
// Here we will describe a variable popupid which gets the
// rel attribute from the clicked link							
var popupid = $(this).attr('rel');


// Now we need to popup the marked which belongs to the rel attribute
// Suppose the rel attribute of click link is popuprel then here in below code
// #popuprel will fadein
$(popuprel3).fadeIn();


// append div with id fade into the bottom of body tag
// and we allready styled it in our step 2 : CSS
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();


// Now here we need to have our popup box in center of 
// webpage when its fadein. so we add 10px to height and width 
var popuptopmargin = ($(popuprel3).height() + 10) / 2;
var popupleftmargin = ($(popuprel3).width() + 10) / 2;


// Then using .css function style our popup box for center allignment
$(popuprel3).css({
'margin-top' : -popuptopmargin,
'margin-left' : -popupleftmargin
});



// Now define one more function which is used to fadeout the 
// fade layer and popup window as soon as we click on fade layer
$('#fade').click(function() {


// Add markup ids of all custom popup box here 						  
$('#fade , #popuprel3').fadeOut()
return false;
});});

theres a div on index.php with an id called popuprel3

Hi all, firstly i'm not a coder but i am capable of doing as instructed. I have some script that when used in conjunction with a button highlights all the text between 2 tags to make it easier for copying, it works great in IE but doesn't work in firefox, could someone help please?
Here's the script and the button is below. Code:

<script type="text/javascript">

function selectCode(a)
{
   // Get ID of code block
   var e = a.parentNode.parentNode.getElementsByTagName('CODE')[0];

   // Not IE
   if (window.getSelection)
   {
      var s = window.getSelection();
      // Safari
      if (s.setBaseAndExtent)
      {
         s.setBaseAndExtent(e, 0, e, e.innerText.length - 1);
      }
      // Firefox and Opera
      else
      {
         var r = document.createRange();
         r.selectNodeContents(e);
         s.removeAllRanges();
         s.addRange(r);
      }
   }
   // Some older browsers
   else if (document.getSelection)
   {
      var s = document.getSelection();
      var r = document.createRange();
      r.selectNodeContents(e);
      s.removeAllRanges();
      s.addRange(r);
   }
   // IE
   else if (document.selection)
   {
      var r = document.body.createTextRange();
      r.moveToElementText(e);
      r.select();
   }
}
</script>

Html button Code:

<input type="button" value="Highlight Code" onclick="selectCode(this); return false;">

Since I like to minimize on graphics to keep bandwidth low, I have been using a script to simulate buttons. When you mouseover, you get some color changes which revert back when you move the mouse off. Simple, right?

The problem is that firefox totally ignores the script. Even worse, safari changes on mouseover, but doesn't revert on mouseout.

I have this in the heading:

Code:

<script LANGUAGE="JavaScript">

function ColorBlock(oRegion,sLinkID) 
{	
	if (document.readyState != "complete") return;
	window.event.cancelBubble = true;
	oRegion.className = "MenuSelected";	
	oRegion.style.cursor="hand";
	sLinkID.style.color = "black";
}

function UncolorBlock(oRegion,sLinkID) 
{
	if (document.readyState != "complete") return;
	window.event.cancelBubble = true;
	var oToEl = window.event.toElement;
	if ((oToEl && !oRegion.contains(oToEl))||!oToEl) 
	{
	sLinkID.style.color = "white";
	oRegion.className = "MenuUnSelected";
	}
}
</script>

And this is in the body.

Code:

<table class=MenuTable>
   <tr><td  OnMouseover="ColorBlock(this, Link4);"
            OnMouseout="UncolorBlock(this, Link4);"
            CLASS="MenuUnSelected" nowrap>
      <a STYLE="color:white" ID="Link4"
         OnMouseover="this.style.textDecorationNone=true;" href="javascript:createWindow('edu.htm','edu','toolbar=1,location=1,directories=1,status=1,menubar=1,scrollbars=1,resizable=1,width=825,height=725')">
      <div style="width:144; cursor=hand; font-weight:bold;">
      Education
      </a></div></td>
    </tr>
</table>

I have a bunch of these "buttons" ... firefox ignoring the code is annoying but safari only using half the code makes it look really bad. Anyone have any ideas?

I've done a lot of work over time on the site, there are just a few bugs that have been avoiding me and I am trying to hunt them all down and kill them.

The page is at www.adam-k-watts.com

Hi Coders,

I have a Javascript on my credit card page which populates the elements of a dropdown field (The Year field).
It just works with Internet Explorer and not Firefox.

Here is the script:

<script type="text/javascript">
<%
Dim orderDateYearx
orderDateYearx = cStr(Year(Date))
%>

yy="<%=orderDateYearx%>";
yyyy=parseInt(yy);
yyyy=yyyy

var listDocUpload = document.getElementById("expDate2");
var optn = document.createElement("OPTION");
optn.value = yyyy;
yyyy=yyyy+""
optn.text = yyyy.replace("20","");
listDocUpload.options.add(optn);

yyyy=parseInt(yyyy)+1
var optn2 = document.createElement("OPTION");
optn2.value = yyyy;
yyyy=yyyy+""
optn2.text = yyyy.replace("20","");
listDocUpload.options.add(optn2);

yyyy=parseInt(yyyy)+1
var optn3 = document.createElement("OPTION");
optn3.value = yyyy;
yyyy=yyyy+""
optn3.text = yyyy.replace("20","");
listDocUpload.options.add(optn3);
</script>

The dropdown field in Firefox is just blank. I mean no elements reside within it. (but its clickable)

Any ideas why this dropdown field in Firefox is not going to be populated?
Thank you for all the comments.

Hi coders,

I have a form where customers can register thierselves by entering the relevant fields.

There is a control() javascript which ckecks if everything on the form is ok before submitting it.
Althugh IE applies the script for its every check, Firefox only applies the first check (first if statement) of the script. The rest is ignored.

Here is the javascript code:
Code:

function control() 
{ 
if (document.member.FirstName.value == ""){ 
document.member.FirstName.focus(); 
alert("Please fill the name field"); 
return false; 
} 

if (document.member.FirstName.value.length<2) { 
alert("Name field cannot be shorter than 2 characters."); 
document.member.FirstName.focus(); 
return false; 
} 

if (/[\d]/.test(document.getElementById("FirstName").value)) { 
alert("Entered numbers into the Name field"); 
return false; 
} 

if (document.member.LastName.value == ""){ 
document.member.LastName.focus(); 
alert("Please fill the Lastname field"); 
return false; 
} 

if (document.member.LastName.value.length<2) { 
alert("Lastname field cannot be shorter than 2 charcters. Please check again."); 
document.member.LastName.focus(); 
return false; 
} 

if (/[\d]/.test(document.getElementById("LastName").value)) { 
alert("Entered numbers into the Lastname field"); 
return false; 
} 

if (document.member.Address1.value.length<10) { 
alert("Address field contains less than 2 characters."); 
document.member.Address1.focus(); 
return false; 
} 

if (document.member.Username.value == ""){ 
document.member.Username.focus(); 
alert("Username field cannot be blank"); 
return false; 
} 

if (document.member.Address1.value == ""){ 
document.member.Address1.focus(); 
alert("Address field cannot be blank "); 
return false; 
} 

if (document.member.City.value == ""){ 
document.member.City.focus(); 
alert("City field cannot be blank"); 
return false; 
} 

if (document.member.Email.value == ""){ 
document.member.Email.focus(); 
alert("E-Mail field cannot be blank."); 
return false; 
} 

if (echeck(document.member.Email.value)==false){ 
document.member.Email.focus(); 
return false; 
} 

if (document.member.PhoneNumber.value == ""){ 
document.member.PhoneNumber.focus(); 
alert("Phone number field cannot be blank"); 
return false; 
} 

if (!/^\d*$/.test(document.getElementById("PhoneNumber").value)) { 
alert("Entered characters into the Phone Number field"); 
return false; 
} 

if (document.member.Pass.value == ""){ 
document.member.Pass.focus(); 
alert("Password field cannot be blank."); 
return false; 
} 

if (document.member.Pass2.value == ""){ 
document.member.Pass2.focus(); 
alert("Password confirmation field cannot be blank."); 
return false; 
} 

if (document.forms[0].Pass.value.length<6) { 
alert("Password field cannot contain less than 6 characters. Please check"); 
document.member.Pass.focus(); 
return false; 
} 

if (document.member.Pass.value != document.member.Pass2.value) { 
alert("Password and password confirmation fields are not identical. Please check "); 
document.member.Pass.focus(); 
return false; 
} 


if (!isTelNum(document.forms[0].PhoneNumber,'Telefon ')) return false; 
if (!isNum(document.forms[0].InternalPhoneNumber,'Internal Phone number')) return false; 
//if (!isValidEmail(document.forms[0].Email)) return false; 

return true; 
}

Well its interesting that only the first check is taken into consideration.

if (document.member.FirstName.value == ""){

The rest is not even seen. Even if you do not fill the rest of the form, the submit button tries to submit the form regardless what more needs to be checked.

Here is the submit button:
Code:

<input type="submit" name="member" value="Register Me" id="member" onclick="return control()";>

Any observations and comments are appreciated.

I have this script and it is performing the calculations to provide an instant price quote script fine in IE and also making only certain boxes editable when a certain radio button is clicked. However in Firefox or Safari it isn't working.

Code:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">

td.calchead{
width:75px;
background:none;
border-top:thin solid black;
text-align:right;
}

td.calc{
width:75px;
background:none;
border:thin solid black;
text-align:right;
}

td.products{
float:right;
text-align:right;
border:1px solid black;
}
td.inputs{
width:200px;
float:right;
text-align:right;
}

p.products{
text-align:left;
font-family:Georgia, "Times New Roman", Times, serif, 14px;
}

p.inputs{
text-align:left;
font-family:Georgia, "Times New Roman", Times, serif, 14px;
}

input.inputs{
width:30px;
background-color:CCCCCC;
}
p.calculate{
text-align:left;
font-family:Georgia, "Times New Roman", Times, serif, 14px;
}
</style>

<?php
$header = $_POST['header'];
$productid = $_POST['group1'];
$width = $_POST['width'];
$height = $_POST['height'];
$openings = $_POST['openings'];
$clearpanel = $_POST['clearpanel'];
$resident = $_POST['resident'];
$color = $_POST['color'];
$motor = $_POST['motor'];


$priceperheader=.5833;

//error checking, ensures all variables are numeric between calculatable values 0 and 999
if($width>=0 && $width<=999 && $height>=0 && $height<=999 && $openings>=0 && $openings<=999 && $clearpanel>=0 && $clearpanel<=999)
{
$width2=$width+6;
$height2=$height+6;

if($productid == 'Roll-down Shutters')
{
$height2=$height2+4;
}

$wh=$width2*$height2;

if($header=='yes')
{
$he=$openings*$width;
$he=$he*$priceperheader;
}
else
{
$he=0;
}

if($resident=='yes')
{
$tax=1.085;
}
else
{
$tax=1;
}


if($motor=='2')
{
$motor=488*$openings;
}
else
{
$motor=0;
}
//$cl=$clearpanel*$priceperclearpanel;
//echo('  ' + $wh + ' '  + $he + ' ' + $cl + '  ');

//divide sq ft by 144 to get sq inches
////.050 alum =$4.94 per sq ft
////24 gauge steel =$3.72 per sq ft                                                                            
////change Protexan to Lexan =9.94 sq ft
////roll downs = $24.99 per sq ft motor = $488.
////bahama impact = 25.99 sq ft no impact 21 per sq ft
////colonial impact = 25.99 and non = 21 sq ft
////Hurricane Fabric $6.38 per sq ft


//All prices are self install only installation is extra and highly reccommended
////F track = $1.79 per ft 
////H track = $2.29 per ft 
////Texas residents add 8.25 percent sales tax

//Standard Clamshell<input type='radio' name='group1' value='Standard Clamshell' onFocus="enable5()"><br />
//Impact Clamshell<input type='radio' name='group1' value='Impact Clamshell' onFocus="enable5()"><br />  
//.063 Aluminum Panels<input type='radio' name='group1' value='.063 Aluminum Panels' onFocus="enable1()"><br />
//Accordian Shutters<input type='radio' name='group1' value='Accordian Shutters' onFocus="enable4()" /><br />
function sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2)
{
$wh=$wh*$priceperopening;

$subtotal=$wh+$he;
$subtotal=$subtotal+$motor;

$total=$subtotal*$tax;
$tax=$total-$subtotal;
echo("<table><tr ><td>Product</td><td>Measured Opening</td><td>Finished Opening</td></tr>
<tr><td >" . $productid . "</td><td align'right'>" . $width . " x " . $height . "</td><td align'right'>" . $width2 . " x " . $height2 . "</td></tr></table>
<table><tr><td></td><td class='calchead'>Shutter</td><td class='calchead'>Header</td><td class='calchead'>Motor</td><td class='calchead'>Tax</td><td class='calchead'>Total</td></tr>
<tr><td>$</td><td class='calc'>". money_format('%.2n',$wh) . "</td><td width='30' class='calc'>". money_format('%.2n',$he) . "</td><td width='30' class='calc'>" . money_format('%.2n',$motor) . "</td><td width='30' class='calc'>" . money_format('%.2n',$tax) . "</td><td align='right' class='calc'>$" . money_format('%.2n',$total) . "</td></tr></table>");
}

if($productid == '.050 Aluminum Panels')
{
$priceperopening=.03431;

sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}

if($productid == '24 gauge steel')
{
$priceperopening=.02583;

sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}

if($productid == 'lexan')
{
$priceperopening=.0659;

sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2); 
}
if($productid == 'Roll-down Shutters')
{
$priceperopening=.17354;
sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}

if($productid == 'Impact Bahama Shutters')
{
$priceperopening=.18049;

sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}
if($productid == 'Impact Colonial Shutters')
{
$priceperopening=.18049;
sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}
if($productid == 'Hurricane Fabric')
{
$priceperopening=.04431;
sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}
if($productid == 'Non-Impact Bahama Shutters')
{
$priceperopening=.14583;
sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}
if($productid == 'Non-Impact Colonial Shutters')
{
$priceperopening=.14583;
sum($productid, $priceperopening, $wh, $he, $tax, $motor, $width, $height, $width2, $height2);
}

}
else
{echo('Please make sure to enter numbers greater than zero and less than 999 in all required fields.');}

$header='';
?>
<script type='text/javascript'>
//white() clears backs of inputs to white and is called from eable functions
function white(){
document.getElementById("header").style.background='#ffffff';
document.getElementById("width").style.background='#ffffff';
document.getElementById("height").style.background='#ffffff';
document.getElementById("openings").style.background='#ffffff';
document.getElementById("resident").style.background='#ffffff';
document.getElementById("color").style.background='#ffffff';
document.getElementById("motor").style.background='#ffffff';
}

//enable1-5() enables particular requested fields specific for product type and disables unused fields.
function enable1()
{
white();
document.getElementById("header").disabled='';
document.getElementById("width").disabled='';
document.getElementById("height").disabled='';
document.getElementById("openings").disabled='';
document.getElementById("resident").checked='';
document.getElementById("resident").disabled='';
document.getElementById("color").style.background='#CCCCCC';
document.getElementById("color").value='';
document.getElementById("color").disabled='true';
document.getElementById("motor").style.background='#CCCCCC';
document.getElementById("motor").value='';
document.getElementById("motor").disabled='true';
}
function enable2()
{
white();
document.getElementById("header").disabled='';
document.getElementById("width").disabled='';
document.getElementById("height").disabled='';
document.getElementById("openings").disabled='';
document.getElementById("resident").checked='';
document.getElementById("resident").disabled='';
document.getElementById("color").value='';
document.getElementById("color").style.background='#CCCCCC';
document.getElementById("color").disabled='true';
document.getElementById("motor").value='';
document.getElementById("motor").style.background='#CCCCCC';
document.getElementById("motor").disabled='true';
}

function enable3()
{
white();
document.getElementById("header").checked='';
document.getElementById("header").style.background='#CCCCCC';
document.getElementById("header").disabled='true';
document.getElementById("width").disabled='';
document.getElementById("height").disabled='';
document.getElementById("openings").disabled='';
document.getElementById("resident").disabled='';
document.getElementById("resident").checked='';
document.getElementById("color").disabled='';
document.getElementById("motor").disabled='';
}

function enable4()
{
white();
document.getElementById("header").checked='';
document.getElementById("header").style.background='#CCCCCC';
document.getElementById("header").disabled='true';
document.getElementById("width").disabled='';
document.getElementById("height").disabled='';
document.getElementById("openings").disabled='';
document.getElementById("resident").checked='';
document.getElementById("resident").disabled='';
document.getElementById("color").disabled='';
document.getElementById("motor").style.background='#CCCCCC';
document.getElementById("motor").value='';
document.getElementById("motor").disabled='true';
}

function enable5()
{
white();
document.getElementById("header").checked='';
document.getElementById("header").disabled='true';
document.getElementById("header").style.background='#CCCCCC';
document.getElementById("width").disabled='';
document.getElementById("height").disabled='';
document.getElementById("openings").disabled='';
document.getElementById("resident").checked='';
document.getElementById("resident").disabled='';
document.getElementById("color").value='';
document.getElementById("color").disabled='true';
document.getElementById("color").style.background='#CCCCCC';
document.getElementById("motor").value='';
document.getElementById("motor").disabled='true';
document.getElementById("motor").style.background='#CCCCCC';
}
</script>



<title>Estimator</title>
</head>

<body>
<div>
<table>
<tr>
<td><p class='products'>First, select a product</p></td>
<td><p class='inputs'>Then, enter dimensions and select options (in inches) that appear in white</p></td>
</tr>
<tr>
<td class='products'>
<form width='550' name='form01' method='post' action='http://www.windowguardoftexas.com/estimator.php'>
.050 Aluminum Panels<input type='radio' name='group1' value='.050 Aluminum Panels' onFocus="enable1()"><br />
24 Gauge Steel<input type='radio' name='group1' value='24 gauge steel' onFocus="enable1()"><br />
Lexan<input type='radio' name='group1' value='lexan' onFocus="enable2()"><br />
Roll-down Shutters<input type='radio' name='group1' value='Roll-down Shutters' onFocus="enable3()"><br />
Impact Bahama Shutters<input type='radio' name='group1' value='Impact Bahama Shutters' onFocus="enable4()"><br />
Impact Colonial Shutters<input type='radio' name='group1' value='Impact Colonial Shutters' onFocus="enable4()"><br />
Hurricane Fabric<input type='radio' name='group1' value='Hurricane Fabric' onFocus="enable5()"><br />   
Non-Impact Bahama Shutters<input type='radio' name='group1' value='Non-Impact Bahama Shutters' onFocus="enable4()"><br />
Non-Impact Colonial<input type='radio' name='group1' value='Non-Impact Colonial Shutters' onFocus="enable4()"><br />
</td>
<td class='inputs'>	 					
Add Header and F-track to openings:&nbsp;<input type='checkbox' name='header' class='inputs' value='yes' disabled="disabled"/><br />
        Width:&nbsp;<input type='text' class='inputs' name='width' value='' maxlength='3'disabled='disabled' /><br />
        Height:&nbsp;<input type='text' class='inputs' name='height' value='' maxlength='3' disabled='disabled' /><br />
        Openings:&nbsp;<input type='text' class='inputs' name='openings' value='' maxlength='3' disabled='disabled' /><br />
        Texas Resident&nbsp;<input type='checkbox' name='resident' class='inputs' value='yes' disabled="disabled"/><br />
        Color:&nbsp;<select name="color" id='color' class='inputs' disabled='disabled'><br />
			<option value="0" >--Select Color--</option>
			<option value="1" >White</option>
			<option value="2">Bronze</option>
 			<option value="3">Ivory</option>
            <option value="3">Beige</option>
        </select>
        <br />
         Motor:&nbsp;<select name="motor" class='inputs' disabled="disabled"><br />
			<option value="0">--Select Motor--</option>
            <option value="1">None</option>
			<option value="2" >Standard</option>
        </select>
        <br /><br />
       <p class='calculate'>Finally, press calculate</p>
        <input type='reset' name='Submit2' value='Reset'>
        <input type='submit' name='Submit' value='Calculate'>
</td>
</form>
</tr>
<tr><td>All prices are self install only, installation</td><td>is extra and highly reccommended</td></tr>
</table>
</div>
</body>
</html>

How do I get this to work in Firefox and Safari? Why would it work in IE but not the others?

Hi,
I've written a small script for a website, and strangely enough (or maybe not) it works in Firefox and Chrome but not IE.
I'd read about block level inside inline causing this but i'm still not entirely sure. Here is the offending script:

Code:

function changeImage(image) {
 if (image == 6) {
  var vid = document.createElement('object');
  vid.width = "700";
  vid.height = "370";
  vid.id = "photo";
  vid.innerHTML = '<param name="movie" value="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="700" height="370"></embed>';
  document.getElementById("body").replaceChild(vid, document.getElementById("photo"));
 } else {
  var img = document.createElement('img');
  var old = document.getElementById("photo")
  img.width = "700";
  img.height = "370";
  img.id = "photo";
  img.alt = "Photo of Gippsland Lakehous";
  img.src = "images/photos/" + image + ".jpg";
  document.getElementById("body").replaceChild(img, old);
 }

The offending line is the long innerHTML one. I'm sure this must be a very hacky way of doing things (incidentally the thing is replacing an image with another image or video depending on what is clicked), but I rarely code at all, so don't know any better

Thanks!

The following extremely simply JavaScript code:
Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
onload=function(){
var n=document.getElementsByTagName('div')[0];
alert(n.innerHTML);
}
</script>
</head>
<body>
<div>foo</div>
</body>
</html>

alerts the innerHTML content in all the browsers. Except in Firefox 3.6.8, which alerts a blank value.

What the f? I know that innerHTML is not a standard DOM method, but it used to be a crossbrowser one since FF 1.5, right?
-------
Edit: It does not work even in case of firstChild.nodeValue or firstChild.data. FF 3.6.8 says that the DIV element has no first child, which is amazing.