DocType impact on javascript

R

RK

I'm exploring javascript as a newbie, and have noted that the DocType
has a substantial impact on some of the things I'm trying to do. I
guess certain features have been deprecated, and do not work when I mess
with DocType settings.

I'm playing with dynamic image positioning example off the web where an
image has been positioned with CSS left and top positions gets moved
with arrow keys.

The example runs if I impose an HTML DocType of '//W3C//DTD HTML 3.2
Final//EN' but it won't in HTML 4.01 or my desired "XHTML 1.0
Transitional".

Code info... You can try it out here:
http://newmedia.purchase.edu/~Jeanine/arrowbird.html

But simply, an image is instantiated on the HTML with:


<div id="bird">
<img src="bird.gif" width=16 height=16> </div>

....and the CSS positions it with:

<style type="text/css">
#bird {position: absolute;
top: 200px;
left: 200px;
}

....then in javascript,

function move(deltax, deltay) {
console.log("Move Called and name is: " + thisBallPic.name);
console.log(" Locn: " + thisBallPic.y);

var x = new getObj("bird"); // func sets up the obj refs
currentx += deltax;
currenty += deltay;
x.style.top = currenty;
x.style.left = currentx;



// position may change for next move
if (currentx>swidth) {
currentx = 0; }
if (currenty>sheight) {
currenty = 0;}
if ((currentx + iwidth)<0) {
currentx = swidth; }
if ((currenty+iheight)<0) {
currenty = sheight;}
}

MY QUESTION: What element of this is not supported in the more recent
HTML doc types and is there some substitution available to be XHTML 1.0
friendly?

Thanks in advance,
Ross.
 
M

Martin Honnen

RK said:
...and the CSS positions it with:

<style type="text/css">
#bird {position: absolute;
top: 200px;
left: 200px;

Here in your static CSS you correctly use a number (e.g. 200) and a unit
(e.g. px) for your top and left properties.

x.style.top = currenty;
x.style.left = currentx;

In your script code you need to do the same e.g.
x.style.top = currenty + 'px';

In quirks mode browsers might let you get away with assigning a number
only but most doctypes trigger strict mode. See
https://developer.mozilla.org/index.php?title=En/Mozilla's_Quirks_Mode
 

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

Forum statistics

Threads
473,743
Messages
2,569,478
Members
44,898
Latest member
BlairH7607

Latest Threads

Top