473,326 Members | 2,588 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,326 software developers and data experts.

Specifying a DOCTYPE breaks my JavaScript....

hi,

im fairly new to javascript.

im designing a web page that gives random background colors to some divs. everything works great until i put a DTD (document type definition) at the top of my code. im looking for reasons as to why this is...? I would like to use the DTD to avoid other problems (like quirks mode IE6 etc...)

my page (as I want it to look - without the DTD) can be found at:
http://www.stevenewberry.com/experimental/index3.html

my page (with the correct DTD - but it wont display coloured divs) is at:
http://www.stevenewberry.com/experimental/index2.html

any insight would be awesome!
Aug 7 '07 #1
7 2362
pbmods
5,821 Expert 4TB
Heya, Steve. Welcome to TSDN!

I notice that you are not quoting the div IDs in allColorPick():
Expand|Select|Wrap|Line Numbers
  1. function allColorPick(){
  2.  
  3.     colorpick(div1);
  4.     colorpick(div2);
  5.     colorpick(div3);
  6.     colorpick(div4);
  7.     colorpick(div5);
  8.     colorpick(div6);
  9. }
  10.  
Perhaps it should look like this:
Expand|Select|Wrap|Line Numbers
  1. function allColorPick(){
  2.  
  3.     colorpick('div1');
  4.     colorpick('div2');
  5.     colorpick('div3');
  6.     colorpick('div4');
  7.     colorpick('div5');
  8.     colorpick('div6');
  9. }
  10.  
I don't care what anybody else says; this is why I actually *like* the fact that PHP (oh, and Perl) force you to put a '$' in front of variable names.
Aug 7 '07 #2
pbmods
5,821 Expert 4TB
Changed thread title to better describe the problem.
Aug 7 '07 #3
Logician
210 100+
Perhaps it should look like this:
Expand|Select|Wrap|Line Numbers
  1. function allColorPick(){
  2.  
  3.     colorpick('div1');
  4.     colorpick('div2');
  5.     colorpick('div3');
  6.     colorpick('div4');
  7.     colorpick('div5');
  8.     colorpick('div6');
  9. }
  10.  
Yes but the colorpick function is still addressing the div directly.

Expand|Select|Wrap|Line Numbers
  1. function allColorPick()
  2. {
  3.  colorpick('div1');
  4.  colorpick('div2');
  5.  colorpick('div3');
  6.  colorpick('div4');
  7.  colorpick('div5');
  8.  colorpick('div6');
  9. }
  10.  
  11. function colorpick(myFoo)
  12.  var choices=["#CFAA00","#826A00","#2F799C","#80D7FF","#008AA7","#00CAF2","#A65300","#F25100","#1BCC4D","#76FC00"];
  13.  
  14.  document.getElementById(myFoo).style.backgroundColor=choices[ Math.floor(Math.random()*choices.length) ];
  15. }
  16.  
  17. /* PLEASE REMOVE THE GAP IN THE LINE ABOVE, WHICH WAS INSERTED BY A LONG-TERM BUG ON THIS FORUM */
  18.  
  19. /* AVOID PASTING THIS CODE WITH MOZILLA, AS IT WILL CAPTURE THE LINE NUMBERS DUE TO ANOTHER LONG-TERM BUG.*/
  20.  
  21. /* I MAY NOT NOTICE YOUR REPLY IMMEDIATELY, BECAUSE THE EMAIL NOTIFIER IS LONG-TERM BROKEN */
  22.  
I don't care what anybody else says; this is why I actually *like* the fact that PHP (oh, and Perl) force you to put a '$' in front of variable names.
Proper use of the error console is all that's needed, not hideous syntax.
Aug 8 '07 #4
pbmods
5,821 Expert 4TB
/* PLEASE REMOVE THE GAP IN THE LINE ABOVE, WHICH WAS INSERTED BY A LONG-TERM BUG ON THIS FORUM */

/* AVOID PASTING THIS CODE WITH MOZILLA, AS IT WILL CAPTURE THE LINE NUMBERS DUE TO ANOTHER LONG-TERM BUG.*/

/* I MAY NOT NOTICE YOUR REPLY IMMEDIATELY, BECAUSE THE EMAIL NOTIFIER IS LONG-TERM BROKEN */
Not that you're bitter or anything :P

Good point about the colorpick() function, though.

Steve, just wanted to let you know that your code is working in Safari, which I find curious. But it works, at any rate.
Aug 8 '07 #5
Thanks for the input. The changes worked, and thank you Logician for shortening my code by about 47 lines... this is what learning is all about. Speaking of... while I am grateful that it works now, Im still curious as to why my original code worked in safari and worked in firefox if I DIDNT put a doctype, but didnt work in firefox with a doctype... any thoughts?

Cheers
Aug 8 '07 #6
pbmods
5,821 Expert 4TB
Try running the old code (with the DOCTYPE declared) through the W3C Validator. I bet that would give some ideas.
Aug 8 '07 #7
drhowarddrfine
7,435 Expert 4TB
A doctype is, essentially, the set of rules you tell the browser you are following. This is why the doctype is the very first thing you add to any web document and never change it after that. If you change the doctype, you are changing the rules and that is why a page may act differently.
Aug 8 '07 #8

Sign in to post your reply or Sign up for a free account.

Similar topics

8
by: Matthew Schubert | last post by:
I have reason for an element on a page to be static, like the CSS property "position: fixed" defines. Obviously, this CSS property doesn't work in IE :-/ I have looked around at alternatives,...
1
by: Sugapablo | last post by:
I have the following script (below). If I have the DOCYPE at the top, tDIV.style.top and tDIV.style.left don't return a value. If I remove the DOCTYPE from the first line, it works fine and...
11
by: Simon Shutter | last post by:
Forgive me if I am posting to wrong newsgroup and for a couple of loaded questions. First, from what I understand, one of the advantages of XHTML/CSS is the ability of screen readers/braille...
6
by: Chris Botha | last post by:
I am porting an existing 2003 project to 2005. Yesterday I found that some of my Java script did not want to work. After eventually examining the HTML view of the new and old form for differences,...
6
by: reynard | last post by:
I have a page that uses this doctype <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> but when I change to this: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"...
15
by: Lennart | last post by:
Hi folks, I have created an animated image gallery in dhtml. It works fine in Internet Explorer. In Firefox, it only works if I ommit the DOCTYPE tag. The page is valid xhtml-strict but with a...
24
by: Jim Michaels | last post by:
I can't get any "universal" code working that tries to detect whether the document it's in is xhtml or html. I found this, which tells me I have a hill to climb with no equipment....
0
by: =?Utf-8?B?SGFyZHkgV2FuZw==?= | last post by:
Hi all, I have a web form, and I want to use ModalPopupExtender from Ajax Toolkit. I am using IE 7.0 as browser, VS 2005 and Ajax and Ajax Tool Kit installed. Windows XP Pro. Now I have a...
1
by: rfr | last post by:
Apparently the Transitional Doctype kills this script because the script does not make proper use of units like "px". It works well without a doctype statement. But once someone adds a...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.