Forum Moderators: open

Message Too Old, No Replies

Doctype breaks javascript code

         

supermanjnk

7:44 pm on Dec 9, 2005 (gmt 0)

10+ Year Member



I have the following doc type
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

When I remove the doctype the code functions as it should, but when I have the doctype in there it functions incorrectly.

the code that I am using is from
[mattkruse.com...]
it does what i want, but I can't use the doctype that i need to use for it. any thoughts?

Tidal2

7:56 pm on Dec 9, 2005 (gmt 0)

10+ Year Member



I just use the first part of that
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Try it with just that.

supermanjnk

8:04 pm on Dec 9, 2005 (gmt 0)

10+ Year Member



That works, Thanks for the fast reply.

Fotiman

8:09 pm on Dec 9, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month




I just use the first part of that
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

That technically is not a valid DOCTYPE.

Note, I have no problem using that library with the full DOCTYPE. Can you post your entire HTML code? Here's what I'm using:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript" src="AnchorPosition.js"></script>
<script type="text/javascript">
<!--
function test(name) {
var c = getAnchorPosition(name);
alert("X = "+c.x+" , Y = "+c.y);
}
//-->
</script>
</head>
<body>
<div id="container">
<br><br><br>
<a href="#" name="test1" id="test1">Test Anchor</a>
<br>
<a href="#" onclick="test('test1');return false;">Test</a>
</div>
</body>
</html>

Tidal2

8:11 pm on Dec 9, 2005 (gmt 0)

10+ Year Member



I just check the page the doctype referred to its from 1999, I think so out of date I guess, here is the first section -

' This is the HTML 4.01 Transitional DTD, which includes
presentation attributes and elements that W3C expects to phase out
as support for style sheets matures. Authors should use the Strict
DTD when possible, but may use the Transitional DTD when support
for presentation attribute and elements is required.

HTML 4 includes mechanisms for style sheets, scripting,
embedding objects, improved support for right to left and mixed
direction text, and enhancements to forms for improved
accessibility for people with disabilities.

Draft: $Date: 1999/12/24 23:37:48 $

....'

Tidal2

8:21 pm on Dec 9, 2005 (gmt 0)

10+ Year Member



Sorry we cross posted Fotiman. Is this purely techical or are there any browser impications? I tend to only check in IE6, opera and firefox recently.

supermanjnk

8:21 pm on Dec 9, 2005 (gmt 0)

10+ Year Member



Note, I have no problem using that library with the full DOCTYPE. Can you post your entire HTML code? Here's what I'm using:

Yea that works, but I don't want to just get the coords, I also want to mvoe the div, with what you posted there you've removed the part that actually moves the div which is what i need the code for.

as far as posting it, it's far to long to post here...

supermanjnk

8:36 pm on Dec 9, 2005 (gmt 0)

10+ Year Member



Another issue that i'm now running into is when I use a scrolling div and have multiple links, then that scroll longer then the div (so the scroll bar appears, when I click a link after scrolling down the div appears farther below it instead of right on it as it should,

My basic goal here is to make it so that when you click a link an absolutely positioned div is placed ontop of the link with the contianed text going down from that point

Added: similar to the way a dhtml menu works.

Fotiman

10:45 pm on Dec 9, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month




Yea that works, but I don't want to just get the coords, I also want to mvoe the div, with what you posted there you've removed the part that actually moves the div which is what i need the code for.

You did not specify that in your original post. The library from the website you posted says specifically:


This library has one (not-so-simple) purpose: to get the coordinates of an anchor tag (<A>) on the page.

You should be more specific about what you're looking for when you post.


as far as posting it, it's far to long to post here...

Well, it's hard to help you without understanding what it is you're trying to do. Sorry.

Fotiman

11:03 pm on Dec 9, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



The problem in the example used on that page is that it is missing the unit value for top and left positions.

Here's an updated version that works.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript" src="AnchorPosition.js"></script>
<script type="text/javascript">
<!--
function test(name)
{
var c = getAnchorPosition(name);
alert("X = "+c.x+" , Y = "+c.y);
if (document.getElementById)
{
var o = document.getElementById("testdiv");
if (o.style)
{
o.style.left = c.x + "px";
o.style.top = c.y + "px";
}
}
}
//-->
</script>
</head>
<body>
<div id="container">
<br><br><br>
<a href="#" name="test1" id="test1">Test Anchor</a>
<br>
<a href="#" onclick="test('test1');return false;">Test</a>
<br><br><br><br>
<DIV ID="testdiv" STYLE="position:absolute;width:50px;height:50px;left:20px;top:1000px;background-color:yellow;">asdf</DIV>
</div>
</body>
</html>

DrDoc

12:39 am on Dec 11, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



What exactly is it that doesn't work?

Also, for correctness sake -- the doctype doesn't break anything. The code would already be broken, and not work properly with a valid doctype. Properly written code should work with (or without) a doctype.

supermanjnk

2:34 pm on Dec 12, 2005 (gmt 0)

10+ Year Member



Everything works fine with the code except for one thing, If you put it in a scrolling div and the links go down farther then the length of the div, the coords still go up even though it may be at the top, so once you start scrolling in the div the div begins to appear farther and farther down the page.

added -

Well, it's hard to help you without understanding what it is you're trying to do. Sorry.

Basically I am trying to make a popup tooltip div that appears ontop of an anchor (link) when you click it, this works up until you start scrolling in the div in which case the tooltip div begins to be pushed down.