Planetarion Forums - HTML: placing characters or pictures on specified coordinates

Structural Integrity · 25 Oct 2002, 14:23

How would I go about when I want to place a character or picture on a specific coordinate on a page. Instead of using tonns of spaces.
Or on a coordinate of a picture is possible too.

I have seen something alike in the game "SPACE" ( http://space.darkent.com ) wher the space map is built up from seperate planet-pictures placed over the big space-picture.

25 Oct 2002, 15:17

you don't want that.
afaik, coordinates are different with a different screensize, so ur site would only be visible by a few ppl with ur resolution.

Structural Integrity · 25 Oct 2002, 15:34

Quote:

Originally posted by Rythms
you don't want that.
afaik, coordinates are different with a different screensize, so ur site would only be visible by a few ppl with ur resolution.

I know that would give "certain" problems, but it's not for a real site. It's for some "game" I have in the back of my head (I have one in my head every week, but that's besides the point) and am looking at the possibilities.

(***thinks that alligning to the upperleft corner, and a relatively low res interface would solve the problem you mean***)

Leshy · 25 Oct 2002, 15:36

I would agree with Rythms in saying that placing images or anything at an absolute set of coordinates is a bad idea. Afaik, it's also not possible in HTML.

If you really must, you could work with CSS layers which you can place very precise, with an absolute set of coordinates or relative to another object, although to do something in the style of Space would most likely require a real scripting language, such as JavaScript, Perl or CGI.

Edit: Link to CSS Positioning Tutorial

Atamur · 26 Oct 2002, 03:47

Quote:

Originally posted by Structural Integrity
How would I go about when I want to place a character or picture on a specific coordinate on a page. Instead of using tonns of spaces.
Or on a coordinate of a picture is possible too.

I have seen something alike in the game "SPACE" ( http://space.darkent.com ) wher the space map is built up from seperate planet-pictures placed over the big space-picture.

Code:

<img src=... style="positioning: aboslute; top: 50pt; left: 100pt" />

Structural Integrity · 29 Oct 2002, 10:16

Aight, I got it going a bit. I know how to position objects now.
But my question now is can I change the prosition dynamically with javaScript?

Code:

<style>
			img#p1,p#p1
			{
				position:	absolute;
				clip:		rect(0 30 30 0);
			}
		</style>

		<script language="javascript">

			function getMouse(i)
			{
				if (navigator.appVersion.indexOf('MSIE') != -1)
				{
					if (i == 'x')
						return window.event.clientX
					if (i == 'y')	
						return window.event.clientY
				}
				if (navigator.appVersion.indexOf('NET') != -1)
				{
					if (i == 'x')
						return evt.pageX
					if (i == 'y')	
						return evt.pageY
				}
			}

			function getPos(theX,theY)
			{
				xDis = getMouse('x') - theX
				yDis = getMouse('y') - theY
				
				Dis = (xDis * xDis) + (yDis * yDis)
				Dis = Math.round(Math.sqrt(Dis))

				document.all.p1.left=getMouse('x') //this don't work.... I want it to work!

				//alert("Distance:"+Dis)
			}

			function showPos(theX,theY)
			{


			}
		</script>

Structural Integrity · 29 Oct 2002, 10:49

I know what the fault was... it appears as when you have multiple objects with the same ID and try to change the properties it generates an error "document.all.p1.style is not an object"

Atamur · 29 Oct 2002, 20:44

if you want to move objects in response to mouse events, you have to have an even handler. something like this:

Code:

<body *******move="moveit(event, 'p2')">

<script>
function moveit(e, id)
{
    with (document.getElementById(id).style) {left = e.clientX; top=e.clientY}
}
</script>

[edit]hmm i wonder why on_mouse (without the underscore) got blanked out by the forum. Is it a swearword that I don't know? *shrugs*
[/edit]

MT · 29 Oct 2002, 21:58

Quote:

Originally posted by Atamur

[edit]hmm i wonder why on_mouse (without the underscore) got blanked out by the forum. Is it a swearword that I don't know? *shrugs*
[/edit]

vbulletin is the ace security wise. I particularly like the way you can execute arbitrary javascript on someones computer embedded in a private message.