javascript changes based on the dtd????

S

somebody

Hello all,

I created a function which gets the position of the mouse. This works fine
untill I insert a doctype declaration in the file. The properties
'scrollLeft' and 'scrollTop' in IE will not change anymore. This means the
javascript is changed based on the doctype?

Is this a bug?
Which functions and properties will change their behaviour in what doctype?
Do I miss something?
Is there a solution?


btw in firefox all works as expected
code:

<!--
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
-->
<html>
<head>
<script type="text/javascript">

function initPage(){
// set onmouse move event handler to capture the mouse
position
document.onmousemove=getMousePosition;

// get object
window.obj=document.getElementById('test');
}

function getMousePosition(e){
var x=(e &&
e.pageX)?e.pageX:event.x+document.body.scrollLeft;
var y=(e &&
e.pageY)?e.pageY:event.y+document.body.scrollTop;

window.obj.style.left=x+'px';
window.obj.style.top=y+'px';

document.getElementById('test').innerHTML="x="+x+",y="+y+',<br
/>(scrollLeft='+document.body.scrollLeft+',scrollTop='+document.body.scrollTop+')';

}

window.onload=initPage;
</script>
</head>
<body>
<div id="test"
style="display:block;position:absolute;width:200px;height:50px;border:1px
solid black;"></div>
<div style="width:200%">
<br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br />
</div>
</body>
</html>
 
M

Martin Honnen

somebody said:
I created a function which gets the position of the mouse. This works fine
untill I insert a doctype declaration in the file. The properties
'scrollLeft' and 'scrollTop' in IE will not change anymore. This means the
javascript is changed based on the doctype?

Is this a bug?
Which functions and properties will change their behaviour in what doctype?

IE 6 has two rendering modes, one called quirks mode, one called strict
mode (or called standards compliant mode), and the DOCTYPE declaration
decides on the rendering mode.
In strict mode the <html> element defines the canvas while in quirks
mode the <body> element does so if you use document.body.scrollTop/Left
in quirks mode in strict mode you need
document.documentElement.scrollTop/Left.

You can check
if (typeof document.compatMode != 'undefined' &&
document.compatMode != 'BackCompat') {
// use document.documentElement.scrollTop/Left
}
else {
// use document.body.scrollTop/Left
}


More details on the rendering mode are here:
<http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp>

Note that Mozilla and Opera also switch rendering modes based on the
DOCTYPE declaration, for Mozilla see
<http://www.mozilla.org/docs/web-developer/faq.html>
 
S

somebody

Martin Honnen said:
IE 6 has two rendering modes, one called quirks mode, one called strict
mode (or called standards compliant mode), and the DOCTYPE declaration
decides on the rendering mode.
In strict mode the <html> element defines the canvas while in quirks mode
the <body> element does so if you use document.body.scrollTop/Left in
quirks mode in strict mode you need
document.documentElement.scrollTop/Left.

You can check
if (typeof document.compatMode != 'undefined' &&
document.compatMode != 'BackCompat') {
// use document.documentElement.scrollTop/Left
}
else {
// use document.body.scrollTop/Left
}


More details on the rendering mode are here:
<http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp>

Note that Mozilla and Opera also switch rendering modes based on the
DOCTYPE declaration, for Mozilla see
<http://www.mozilla.org/docs/web-developer/faq.html>



Thanks, thanks, thanks ......(1000 times)


Rob
 
T

Thomas 'PointedEars' Lahn

somebody said:
[...]
I created a function which gets the position of the mouse. This works fine
untill I insert a doctype declaration in the file. The properties
'scrollLeft' and 'scrollTop' in IE will not change anymore. This means the
javascript is changed based on the doctype?

No, but the DOM probably is.
Is this a bug?
No.

Which functions and properties will change their behaviour in what
doctype?
Undefined.

Do I miss something?

Yes. There is the core language, and there is the DOM.
Is there a solution?

Declare the DOCTYPE properly and avoid proprietary references.
btw in firefox all works as expected

Shit happens.
code:

<!--
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
-->

You may want to explain what this is supposed to do.

PointedEars
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,995
Messages
2,570,228
Members
46,818
Latest member
SapanaCarpetStudio

Latest Threads

Top