Go Back   Dynamic Drive Forums > General Coding > JavaScript
Reload this Page Firefox problem
Search Dynamic Drive Forums:

Reply
 
Thread Tools Search this Thread
  #1  
Old 06-30-2006, 07:27 PM
Garpie Garpie is offline
New Comer (less than 5 posts)
  
Join Date: Jun 2006
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Question Firefox problem
Everything works on IE, on FF the input-field to show the colors (RBG) doesn't work, don't know what to do so it also works on firefox.

Here's my script:

HTML 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>Kleurentest</title>
<script language="javascript" type="text/javascript">
function color() {
var naam = document.kleuren.aa.value + document.kleuren.ab.value + document.kleuren.ac.value;
document.kleuren.kleurteksta.value = "#"+naam;
document.kleuren.kleura.style.backgroundColor=(""+ naam +"");
}
</script>
</head>
<body>
  <form name="kleuren">
    <table width="100%" border="0" cellpadding="0" cellspacing="0" id="tabel">
      <tr>
        <td colspan="5" align="center">Choose Your Colors</td>
      </tr>
      <tr>
        <td width="20%" align="center">Red:</td>
        <td width="20%" align="center">Green:</td>
        <td width="20%" align="center">Blue:</td>
        <td width="20%" align="center">RGB</td>
        <td width="20%" align="center">HEX</td>
      </tr>
      <tr>
        <td width="20%" align="center"><select style="background-color:#000000; color:#FFFFFF;" name="aa" onchange="color()">
          <option style="background-color:#000000;" value="00">00</option>
          <option style="background-color:#330000;" value="33">33</option>
          <option style="background-color:#660000;" value="66">66</option>
          <option style="background-color:#990000;" value="99">99</option>
          <option style="background-color:#CC0000;" value="CC">CC</option>
          <option style="background-color:#FF0000;" value="FF">FF</option>
        </select></td>
        <td width="20%" align="center"><select style="background-color:#000000; color:#FFFFFF;" name="ab" onchange="color()">
          <option style="background-color:#000000;" value="00">00</option>
          <option style="background-color:#003300;" value="33">33</option>
          <option style="background-color:#006600;" value="66">66</option>
          <option style="background-color:#009900;" value="99">99</option>
          <option style="background-color:#00CC00;" value="CC">CC</option>
          <option style="background-color:#00FF00;" value="FF">FF</option>
        </select></td>
        <td width="20%" align="center"><select style="background-color:#000000; color:#FFFFFF;" name="ac" onchange="color()">
          <option style="background-color:#000000;" value="00">00</option>
          <option style="background-color:#000033;" value="33">33</option>
          <option style="background-color:#000066;" value="66">66</option>
          <option style="background-color:#000099;" value="99">99</option>
          <option style="background-color:#0000CC;" value="CC">CC</option>
          <option style="background-color:#0000FF;" value="FF">FF</option>
        </select></td>
        <td width="20%" align="center"><input style="background-color:#000000;" name="kleura" size="10" type="text" id="kleura" readonly="readonly" /></td>
        <td width="20%" align="center"><input name="kleurteksta" size="10" type="text" id="kleurteksta" readonly="readonly" value="#000000" /></td>
      </tr>
      <tr>
        <td colspan="5">&nbsp;</td>
      </tr>
      
    <tr>
      <td width="20%" align="center"><input name="border" type="button" id="border" value="Set Border" onclick="document.kleuren.kleur1.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="title" type="button" id="title" value="Set Title" onclick="document.kleuren.kleur2.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="background" type="button" id="background" value="Set Background" onclick="document.kleuren.kleur3.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="text" type="button" id="text" value="Set Text" onclick="document.kleuren.kleur4.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="url" type="button" id="url" value="Set URL" onclick="document.kleuren.kleur5.value=document.kleuren.kleurteksta.value" /></td>
    </tr>
    <tr>
      <td width="20%" align="center"><input name="kleur1" type="text" id="kleur1" /></td>
      <td width="20%" align="center"><input name="kleur2" type="text" id="kleur2" /></td>
      <td width="20%" align="center"><input name="kleur3" type="text" id="kleur3" /></td>
      <td width="20%" align="center"><input name="kleur4" type="text" id="kleur4" /></td>
      <td width="20%" align="center"><input name="kleur5" type="text" id="kleur5" /></td>
    </tr>
  </table>
</form>
</body>
</html>
Hope someone could help me

PS: There are some dutch words in the document because I'm dutch.

[Watch Example]
Last edited by Garpie; 06-30-2006 at 07:47 PM.
Reply With Quote
  #2  
Old 07-01-2006, 07:24 AM
jscheuer1's Avatar
jscheuer1 jscheuer1 is offline
No Kidding?
  
Join Date: Mar 2005
Location: SE PA USA
Posts: 19,002
Thanks: 19
Thanked 1,135 Times in 1,121 Posts
Blog Entries: 3
Default
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>Kleurentest</title>
<script language="javascript" type="text/javascript">
function color(el) {
el.style.backgroundColor=el.options[el.selectedIndex].style.backgroundColor;
var naam = document.kleuren.aa.value + document.kleuren.ab.value + document.kleuren.ac.value;
document.kleuren.kleurteksta.value = "#"+naam;
document.kleuren.kleura.style.backgroundColor='#'+ naam;
}
</script>
</head>
<body>
  <form name="kleuren">
    <table width="100%" border="0" cellpadding="0" cellspacing="0" id="tabel">
      <tr>
        <td colspan="5" align="center">Choose Your Colors</td>
      </tr>
      <tr>
        <td width="20%" align="center">Red:</td>
        <td width="20%" align="center">Green:</td>
        <td width="20%" align="center">Blue:</td>
        <td width="20%" align="center">RGB</td>
        <td width="20%" align="center">HEX</td>
      </tr>
      <tr>
        <td width="20%" align="center"><select style="background-color:#000000; color:#FFFFFF;" name="aa" onchange="color(this)">
          <option style="background-color:#000000;" value="00">00</option>
          <option style="background-color:#330000;" value="33">33</option>
          <option style="background-color:#660000;" value="66">66</option>
          <option style="background-color:#990000;" value="99">99</option>
          <option style="background-color:#CC0000;" value="CC">CC</option>
          <option style="background-color:#FF0000;" value="FF">FF</option>
        </select></td>
        <td width="20%" align="center"><select style="background-color:#000000; color:#FFFFFF;" name="ab" onchange="color(this)">
          <option style="background-color:#000000;" value="00">00</option>
          <option style="background-color:#003300;" value="33">33</option>
          <option style="background-color:#006600;" value="66">66</option>
          <option style="background-color:#009900;" value="99">99</option>
          <option style="background-color:#00CC00;" value="CC">CC</option>
          <option style="background-color:#00FF00;" value="FF">FF</option>
        </select></td>
        <td width="20%" align="center"><select style="background-color:#000000; color:#FFFFFF;" name="ac" onchange="color(this)">
          <option style="background-color:#000000;" value="00">00</option>
          <option style="background-color:#000033;" value="33">33</option>
          <option style="background-color:#000066;" value="66">66</option>
          <option style="background-color:#000099;" value="99">99</option>
          <option style="background-color:#0000CC;" value="CC">CC</option>
          <option style="background-color:#0000FF;" value="FF">FF</option>
        </select></td>
        <td width="20%" align="center"><input style="background-color:#000000;" name="kleura" size="10" type="text" id="kleura" readonly="readonly" /></td>
        <td width="20%" align="center"><input name="kleurteksta" size="10" type="text" id="kleurteksta" readonly="readonly" value="#000000" /></td>
      </tr>
      <tr>
        <td colspan="5">&nbsp;</td>
      </tr>
      
    <tr>
      <td width="20%" align="center"><input name="border" type="button" id="border" value="Set Border" onclick="document.kleuren.kleur1.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="title" type="button" id="title" value="Set Title" onclick="document.kleuren.kleur2.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="background" type="button" id="background" value="Set Background" onclick="document.kleuren.kleur3.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="text" type="button" id="text" value="Set Text" onclick="document.kleuren.kleur4.value=document.kleuren.kleurteksta.value" /></td>
      <td width="20%" align="center"><input name="url" type="button" id="url" value="Set URL" onclick="document.kleuren.kleur5.value=document.kleuren.kleurteksta.value" /></td>
    </tr>
    <tr>
      <td width="20%" align="center"><input name="kleur1" type="text" id="kleur1" /></td>
      <td width="20%" align="center"><input name="kleur2" type="text" id="kleur2" /></td>
      <td width="20%" align="center"><input name="kleur3" type="text" id="kleur3" /></td>
      <td width="20%" align="center"><input name="kleur4" type="text" id="kleur4" /></td>
      <td width="20%" align="center"><input name="kleur5" type="text" id="kleur5" /></td>
    </tr>
  </table>
</form>
</body>
</html>
__________________
WWWWWWWWWWWW
- John
________________________

Really Show Your Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate
Reply With Quote
  #3  
Old 07-03-2006, 02:08 AM
Garpie Garpie is offline
New Comer (less than 5 posts)
  
Join Date: Jun 2006
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Default
Thank You Very Much
Reply With Quote
Reply

Bookmarks

« Previous Thread | Next Thread »
Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT. The time now is 03:36 AM.

Dynamic Drive - Archive - Top
Home - Contact Us - Archives - Link to DD - Top 

Powered by vBulletin® Version 3.8.1
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.