Position and top of a div after move

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

DL - 28 Apr 2008 04:17 GMT

Hi,

My research on this NG hasn't produced a satisfactory answer. Here's
what I want to do:
move two div (s) (each has an image tag within) to another location on
the same page.
// no problem with that
// prior to move, position = fixed;
// at each move, I capture the new top value

Now, the question is, how do I display the two div (s) with the new
position and top (the top part is working)?
// currently, the second div, that is an image within it lays below
the first one but the move action places the second div to the right
of the first.

In other words, with the new page, I don't know what value to use for
the position Attribute for each of the two div (s). I've tried
different combo for the "Absolute" | "Fixed" value ...

TIA.

Reply to this Message

DL - 29 Apr 2008 02:03 GMT

> Hi,
>
[quoted text clipped - 17 lines]
>
> TIA.

Is the problem too difficult to be resolved or is my problem statement
not clear enough (I thought if you'v done something similar it
wouldn't be too difficult to understand what is presented here)?

Thanks.

Reply to this Message

Ben C - 29 Apr 2008 11:13 GMT

>> Hi,
>>
[quoted text clipped - 20 lines]
> Is the problem too difficult to be resolved or is my problem statement
> not clear enough

I think the latter!

> (I thought if you've done something similar it wouldn't be too
> difficult to understand what is presented here)?

I really couldn't understand it at all. How do you capture the new top
value? When you say new position, do you mean new location on the screen
or new value of the position property? Where do you want the image to
move to? Where is it moving to?

Reply to this Message

Ben Bacarisse - 29 Apr 2008 14:26 GMT

>> My research on this NG hasn't produced a satisfactory answer. Here's
>> what I want to do:
[quoted text clipped - 3 lines]
>> // prior to move, position = fixed;
>> // at each move, I capture the new top value

I don't follow this. Moving is not a common CSS operation. When do
you move things? My first thought is you are using JS and thus your
post is off topic, but...

>> Now, the question is, how do I display the two div (s) with the new
>> position and top (the top part is working)?
[quoted text clipped - 5 lines]
>> the position Attribute for each of the two div (s). I've tried
>> different combo for the "Absolute" | "Fixed" value ...

a URL will more the double your chance of someone helping. A "best
attempt" live example is worth 1000 words.

Signature

Ben.

Reply to this Message

Jeff - 29 Apr 2008 16:48 GMT

> Hi,
>
[quoted text clipped - 5 lines]
> // prior to move, position = fixed;
> // at each move, I capture the new top value

It's unknown and indecipherable what you are doing.

You need to use javascript to read element attributes/properties. How
you do that depends on just what you want to read and whether it is in
the document flow or outside of it.

My guess is that googling "javascript find position" might give you a
start.

If you want the image to lay on top of the existing page, you'll want
position: absolute, and you'll want to either set a zIndex or write the
html for those late in the page html so it's inherent zIndex is higher.

Jeff

> Now, the question is, how do I display the two div (s) with the new
> position and top (the top part is working)?
[quoted text clipped - 7 lines]
>
> TIA.

Reply to this Message

DL - 30 Apr 2008 00:16 GMT

>...
> It's unknown and indecipherable what you are doing.
[quoted text clipped - 11 lines]
>
> Jeff

Thank you all. Let me clarify what I intend to do here.

The page has two components of simple inline CSS and HTML code and
content.

Objective: find the values of the two Attributes of {postion} and
{top}, in essence the x/y coordinates of the DIV of ID "ElementOne"
after its move to another spot of the same page.
// don't worry about how to move it, it's done

The key aspects of "things" are as follows:
// CSS part
<style type="text/css">
div#ElementOne {
    position: absolute; /* try fixed as well*/
    top: 300px;
    z-index: 200;
}
</style>


...
<div id="ElementOne">This is Element One</div>
...

Thanks.

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / April 2008

Position and top of a div after move