Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss
DOCTYPE related question
5 views
Skip to first unread message
Tom de Neef
Feb 10, 2012, 6:48:05 AM2/10/12
to
I have a JavaScript function which extracts data from a genealogical html
page and produces a layout chart of the family relationships which is then
inserted in the page.
It works fine on my testpages, which do not have a DOCTYPE (just start with
<html>). The function is called from <body onload='functionCall()'>.
The production site has pages which start with
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head <html
xmlns="http://www.w3.org/1999/xhtml">
Here, the chart is produced but all elements of the chart fall on each other
with FF and Chrome (IE8 does fine).
The function inserts nodes in the DOM. These nodes are created using:
function newNode(x,y,width,height) {
var node = document.createElement('div');
node.style.position='absolute';
node.style.left = xOffset+x;
node.style.top = yOffset+y;
node.style.width = width;
node.style.height = height;
return node;
}
(xOffset and yOffset are global to the encapsulating function.)
It appears that the positioning and size info will not be interpreted with
this Transitional XHTML 1.0.
The page was successfully checked as valid XHTML.
I hope this is enough info for an advice how to modify.
Thank you,
Tom
page and produces a layout chart of the family relationships which is then
inserted in the page.
It works fine on my testpages, which do not have a DOCTYPE (just start with
<html>). The function is called from <body onload='functionCall()'>.
The production site has pages which start with
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head <html
xmlns="http://www.w3.org/1999/xhtml">
Here, the chart is produced but all elements of the chart fall on each other
with FF and Chrome (IE8 does fine).
The function inserts nodes in the DOM. These nodes are created using:
function newNode(x,y,width,height) {
var node = document.createElement('div');
node.style.position='absolute';
node.style.left = xOffset+x;
node.style.top = yOffset+y;
node.style.width = width;
node.style.height = height;
return node;
}
(xOffset and yOffset are global to the encapsulating function.)
It appears that the positioning and size info will not be interpreted with
this Transitional XHTML 1.0.
The page was successfully checked as valid XHTML.
I hope this is enough info for an advice how to modify.
Thank you,
Tom
Jukka K. Korpela
Feb 10, 2012, 7:05:20 AM2/10/12
to
2012-02-10 13:48, Tom de Neef wrote:
> I hope this is enough info for an advice how to modify.
You didn’t specify the URL.
> I hope this is enough info for an advice how to modify.
If adding a DOCTYPE declaration causes a problem, then the real problem
was that your page design relies on Quirks Mode features. This can means
dozens of things.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Martin Honnen
Feb 10, 2012, 7:07:10 AM2/10/12
to
Tom de Neef wrote:
> The function inserts nodes in the DOM. These nodes are created using:
> function newNode(x,y,width,height) {
> var node = document.createElement('div');
> node.style.position='absolute';
> node.style.left = xOffset+x;
Check the error console, I am sure it warns that you are assigning
> The function inserts nodes in the DOM. These nodes are created using:
> function newNode(x,y,width,height) {
> var node = document.createElement('div');
> node.style.position='absolute';
> node.style.left = xOffset+x;
values which are not proper CSS values as for instance 'left' needs a
number plus a unit e.g.
node.style.left = xOffset + x + 'px';
That way most of your dynamically assigned CSS values are ignored in
standards mode by the browser.
--
Martin Honnen --- MVP Data Platform Development
http://msmvps.com/blogs/martin_honnen/
Thomas 'PointedEars' Lahn
Feb 10, 2012, 7:35:32 AM2/10/12
to
Tom de Neef wrote:
> […]
> xmlns="http://www.w3.org/1999/xhtml">
Not Valid. (Is it so hard to copy and paste your code?)
> Here, the chart is produced but all elements of the chart fall on each
> other with FF and Chrome (IE8 does fine).
>
> The function inserts nodes in the DOM. These nodes are created using:
> function newNode(x,y,width,height) {
> var node = document.createElement('div');
> node.style.position='absolute';
> node.style.left = xOffset+x;
> node.style.top = yOffset+y;
> node.style.width = width;
> node.style.height = height;
> return node;
> }
>
> (xOffset and yOffset are global to the encapsulating function.)
> It appears that the positioning and size info will not be interpreted with
> this Transitional XHTML 1.0.
The relevance of this question to ECMAScript-based scripting is zero. It is
a *CSS* issue. Read the CSS 2.1 Specification on the proper values for the
`left' etc. properties. Those are most certainly not (you have not posted
the *call*).
> The page was successfully checked as valid XHTML.
Either the validator you use is borken or you have not copy-pasted the code.
> I hope this is enough info for an advice how to modify.
Probably it is where this is on-topic.
PointedEars
--
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not
the best source of advice on designing systems that use javascript.
-- Richard Cornford, cljs, <f806at$ail$1$8300...@news.demon.co.uk>
> […]
> The production site has pages which start with
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head <html
^^^^^^^^^^^
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head <html
> xmlns="http://www.w3.org/1999/xhtml">
Not Valid. (Is it so hard to copy and paste your code?)
> Here, the chart is produced but all elements of the chart fall on each
> other with FF and Chrome (IE8 does fine).
>
> The function inserts nodes in the DOM. These nodes are created using:
> function newNode(x,y,width,height) {
> var node = document.createElement('div');
> node.style.position='absolute';
> node.style.left = xOffset+x;
> node.style.top = yOffset+y;
> node.style.width = width;
> node.style.height = height;
> return node;
> }
>
> (xOffset and yOffset are global to the encapsulating function.)
> It appears that the positioning and size info will not be interpreted with
> this Transitional XHTML 1.0.
a *CSS* issue. Read the CSS 2.1 Specification on the proper values for the
`left' etc. properties. Those are most certainly not (you have not posted
the *call*).
> The page was successfully checked as valid XHTML.
> I hope this is enough info for an advice how to modify.
PointedEars
--
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not
the best source of advice on designing systems that use javascript.
-- Richard Cornford, cljs, <f806at$ail$1$8300...@news.demon.co.uk>
Jeff North
Feb 10, 2012, 9:34:29 AM2/10/12
to
On Fri, 10 Feb 2012 12:48:05 +0100, in comp.lang.javascript "Tom de
Neef" <tde...@qolor.nl>
a requirement for XHTML.
>| function newNode(x,y,width,height) {
>| var node = document.createElement('div');
>| node.style.position='absolute';
>| node.style.left = xOffset+x;
node.style.left = xOffset+x + "px";
>| node.style.top = yOffset+y;
node.style.top = yOffset+y +"px";
>| node.style.width = width;
node.style.width = width + "px";
>| node.style.height = height;
node.style.height = height + "px";
Neef" <tde...@qolor.nl>
<4f3503f5$0$6915$e4fe...@news2.news.xs4all.nl> wrote:
>| I have a JavaScript function which extracts data from a genealogical html
>| page and produces a layout chart of the family relationships which is then
>| inserted in the page.
>| It works fine on my testpages, which do not have a DOCTYPE (just start with
>| <html>). The function is called from <body onload='functionCall()'>.
>| The production site has pages which start with
>| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
>| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head <html
>| xmlns="http://www.w3.org/1999/xhtml">
>| Here, the chart is produced but all elements of the chart fall on each other
>| with FF and Chrome (IE8 does fine).
>|
>| The function inserts nodes in the DOM. These nodes are created using:
I hope you've wrapped your script within the CDATA element as this is
>| I have a JavaScript function which extracts data from a genealogical html
>| page and produces a layout chart of the family relationships which is then
>| inserted in the page.
>| It works fine on my testpages, which do not have a DOCTYPE (just start with
>| <html>). The function is called from <body onload='functionCall()'>.
>| The production site has pages which start with
>| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
>| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head <html
>| xmlns="http://www.w3.org/1999/xhtml">
>| Here, the chart is produced but all elements of the chart fall on each other
>| with FF and Chrome (IE8 does fine).
>|
>| The function inserts nodes in the DOM. These nodes are created using:
a requirement for XHTML.
>| function newNode(x,y,width,height) {
>| var node = document.createElement('div');
>| node.style.position='absolute';
>| node.style.left = xOffset+x;
>| node.style.top = yOffset+y;
node.style.top = yOffset+y +"px";
>| node.style.width = width;
node.style.width = width + "px";
>| node.style.height = height;
node.style.height = height + "px";
Tom de Neef
Feb 10, 2012, 10:41:58 AM2/10/12
to
"Martin Honnen" <maho...@yahoo.de> schreef in bericht
news:4f35086c$0$6547$9b4e...@newsspool4.arcor-online.net...
Tom
news:4f35086c$0$6547$9b4e...@newsspool4.arcor-online.net...
> Tom de Neef wrote:
>
>> The function inserts nodes in the DOM. These nodes are created using:
>> function newNode(x,y,width,height) {
>> var node = document.createElement('div');
>> node.style.position='absolute';
>> node.style.left = xOffset+x;
>
> Check the error console, I am sure it warns that you are assigning values
> which are not proper CSS values as for instance 'left' needs a number plus
> a unit e.g.
> node.style.left = xOffset + x + 'px';
> That way most of your dynamically assigned CSS values are ignored in
> standards mode by the browser.
>
Spot on. Thank you.
>
>> The function inserts nodes in the DOM. These nodes are created using:
>> function newNode(x,y,width,height) {
>> var node = document.createElement('div');
>> node.style.position='absolute';
>> node.style.left = xOffset+x;
>
> Check the error console, I am sure it warns that you are assigning values
> which are not proper CSS values as for instance 'left' needs a number plus
> a unit e.g.
> node.style.left = xOffset + x + 'px';
> That way most of your dynamically assigned CSS values are ignored in
> standards mode by the browser.
>
Tom
Tom de Neef
Feb 10, 2012, 10:42:43 AM2/10/12
to
"Jeff North" <jnor...@yahoo.com.au> schreef in bericht
news:6jaaj755k23g5ntuv...@4ax.com...
Tom
news:6jaaj755k23g5ntuv...@4ax.com...
> On Fri, 10 Feb 2012 12:48:05 +0100, in comp.lang.javascript "Tom de
> Neef" <tde...@qolor.nl>
> <4f3503f5$0$6915$e4fe...@news2.news.xs4all.nl> wrote:
>
>>| function newNode(x,y,width,height) {
>>| var node = document.createElement('div');
>>| node.style.position='absolute';
>>| node.style.left = xOffset+x;
> node.style.left = xOffset+x + "px";
That was it. Thank you.
> Neef" <tde...@qolor.nl>
> <4f3503f5$0$6915$e4fe...@news2.news.xs4all.nl> wrote:
>
>>| function newNode(x,y,width,height) {
>>| var node = document.createElement('div');
>>| node.style.position='absolute';
>>| node.style.left = xOffset+x;
> node.style.left = xOffset+x + "px";
Tom
Thomas 'PointedEars' Lahn
Feb 10, 2012, 11:07:41 AM2/10/12
to
Jeff North wrote:
> I hope you've wrapped your script within the CDATA element as this is
> a requirement for XHTML.
No, it is not. It is a recommendation (and I do not mean W3C
> I hope you've wrapped your script within the CDATA element as this is
> a requirement for XHTML.
Recommandation, although that applies as well).
>>| function newNode(x,y,width,height) {
>>| var node = document.createElement('div');
>>| node.style.position='absolute';
>>| node.style.left = xOffset+x;
> node.style.left = xOffset+x + "px";
>>| node.style.top = yOffset+y;
> node.style.top = yOffset+y +"px";
>>| node.style.width = width;
> node.style.width = width + "px";
>>| node.style.height = height;
> node.style.height = height + "px";
>>| return node;
>>| }
be declared CDATA.
0 new messages