Hi
I've just started playing around with the x function library as supplied in the code for chapter 6 of Designing Without Tables Using CSS
What I'm attempting to do is show (via an alert box) the left position of of a displayed graphic file.
When I click on a button an alert windo pops up and is supposed to tell me the left position. The alert pops up ok but shows the value as 0 all the time.
Could someone tell me what I'm doing wrong?
Here's my code -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta http-equiv="Content-Language" content="en-au">
<title>Position test</title>
<script src="resources/x.js" type="text/javascript"></script>
<script type="text/javascript">
function myfunction()
{
var xxx=xLeft("BugIcon"); // I've tried both 'bug' & 'BugIcon' here
alert(xxx);
//I've also tried this
alert(xLeft("BugIcon"));
}
</script>
<style>
#bug {
top: 50px;
left: 50px;
position: absolute;
z-index: 1;
}
</style>
</head>
<body>
<div id="bug">
<div id="BugIcon"><img src="resources/bug.gif" border="0"></div>
</div>
<form>
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
</body>
</html>
Mike would likely be able to tell you more, but I tend to use xLeft purely for moving things - it doesn't seem to return a good result until I've already moved an element.
xOffsetLeft returns the position of the item within its parent. xPageX gets the position within the whole page.
Bookmarks