poistion of elements

[egrave]

How do I poistion a element in javascript

[jscheuer1]

There are many 'ways' and no way. We can access an element's position and establish or modify it using JavaScript to change an element's attributes or its style. These two main approaches have many variations. However, there is no pure JavaScript command to position an element, at least none that I know of. To make things a little more complicated, the ways available to access elements using JavaScript vary according to browser type. In practice we generally can write code that works on most browsers by asking them what they support before using it. If you have something in particular in mind, let us know.

[cr3ative]

You would want to do this using CSS, not javascript.

CSS is quite easy to get used to, and google holds many tutorials as to CSS basics. I strongly suggest you read those before continuing.

Those tutorials may well cover positioning, but if they do not, here is the offical w3 document regarding the subject:
http://www.w3.org/TR/REC-CSS2/visure...tioning-scheme

cr3ative

[egrave]

The problem I have if I create a web page for 800x600 and I use the poistion command then it does not work on a screen running 1024x768 is there any way I can do this that it work on both screen other than using the table command

[jscheuer1]

Table is not a command, it is an element but, yes tables are widely used to position content so that it looks well at different resolutions. A paragraph can have the same effect as can an image tag, a division, there are at least several others, depending on the content. And cr3ative is right, the preferred method to position these elements and their content is css. One can also use attributes like 'align=center' but those are going the way of the dinosaur so, especially if you are just starting out, learn css, it can be fun!

[mwinter]

The problem I have if I create a web page for 800x600

You shouldn't create pages for any resolution. That's not how the Web works. Unlike print, the Web is viewed from devices as small as mobiles, to those as large as TVs. It's simply impossible to create alternatives for the number of combinations, especially as desktop users may not use the entire dimensions of their monitor. In fact, the larger the monitor, the more likely that will be.

the poistion command

The position CSS property is not a command, nor is the table element (as jscheuer said). You should make sure you learn and use the correct terminology as things will get very confusing if you refer to everything as a "command". That's probably the worst possible word, too as neither HTML nor CSS "do" anything so you can't issue "commands" with either language.

is there any way I can do this that it work on both screen

It depends what "this" is. Positioning an element is a very vague description.

Mike

[egrave]

What I would like to know is what code I would use if I put a image at the left corner and a image at the right corner of a 800x600 screen and when view in a 1024x768 and they would be in the right and left corners of that screen.

[mwinter]

What I would like to know is what code I would use if I put a image at the left corner and a image at the right corner of a 800x600 screen and when view in a 1024x768 and they would be in the right and left corners of that screen.

Well, the easiest way to do that is to use the position CSS property to specify absolute positioning, then use the left property to specify the position of the left-most image, and the right property to specify the position of the right-most image. The values you use for those properties will offsets from the sides of the viewport.

For example,

#img-1,
#img-2 {
  position: absolute;
  top: 10px;
}
#img-1 {
  left: 10px;
}
#img-2 {
  right: 10px;
}

would move the elements with the id attribute values 'img-1' and 'img-2' ten pixels from the left and right edges respectively. You could, of course, use other length values and units, including percentages, to locate the elements.

Hope that helps,
Mike

[egrave]

I try the CSS code with (position absolute) but I still wind up with the same problem and That is the element is not in the same place on a 1024 screen as it is on a 800 screen I try to set it in pixels and I try to set in % of screen. Here is what I used.

<STYLE type="text/css">

.pile {
position: absolute;
right: 2%;
top: 10%;
width: 2in;
height: 2in;
}
.pile1 {
position: absolute;
left: 2%;
top: 10%;
width: 2in;
height: 2in;
}
.pile2 {
position: absolute;
left: 120px;
top: 120px;
width: 304px;
height: 309px;
}


</STYLE>
</HEAD>
<BODY>
<P>
<IMG id="image" class="pile"
src="images/main2_01BbA.GIF" style="z-index: 1" width="150" height="198">
<P>
<IMG id="image" class="pile1"
src="images/main2_01BbA.GIF" style="z-index: 1" width="150" height="198">
<P>
<IMG id="image" class="pile2"
src="images/texasmapRWB.gif" style="z-index: 1" width="304" height="309">


</BODY>

[jscheuer1]

the element is not in the same place on a 1024 screen as it is on a 800 screen

That's not the idea. The idea is to get it so it looks OK in any resolution, not identical. All I can see are the where the pictures would be, looks OK in either resolution. Where were you planning on having the text, if any? If there is text and it goes between the pictures, you might prefer using 'float' to position some or all of the pictures and/or text.