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
> I hope this is enough info for an advice how to modify.
You didn’t specify the URL.
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.
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.
> 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$8300d...@news.demon.co.uk>
On Fri, 10 Feb 2012 12:48:05 +0100, in comp.lang.javascript "Tom de
Neef" <tden...@qolor.nl>
<4f3503f5$0$6915$e4fe5...@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
a requirement for XHTML.
>| function newNode(x,y,width,height) {
>| var node = document.createElement('div');
>| node.style.position='absolute';
>| node.style.left = xOffset+x;
>| 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
>|
>> 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.
> On Fri, 10 Feb 2012 12:48:05 +0100, in comp.lang.javascript "Tom de
> Neef" <tden...@qolor.nl>
> <4f3503f5$0$6915$e4fe5...@news2.news.xs4all.nl> wrote:
This script does not contain any `<' or `&'. Therefore, it does not need to be declared CDATA.
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$8300d...@news.demon.co.uk>
