By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,494 Members | 1,957 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,494 IT Pros & Developers. It's quick & easy.

How to know position of div or image tags

P: n/a
I would like to know how I can be able to know the position of an
image or a div tag. My aim is to to put layers in any position I want
to, relative to an image or a div tag. For example If I have the
following code
<div id=layer1>
item1<br>
item2<br>
item3<br>
</div>

<div id=layer2>
item4<br>
item5<br>
</div>

I would like to place layer2 on the left of item2 in layer1. How would
I know the position of item2?

Thank you
John.
Jul 20 '05 #1
Share this Question
Share on Google+
7 Replies


P: n/a
John wrote:
<div id=layer1>
item1<br>
item2<br>
item3<br>
</div>

<div id=layer2>
item4<br>
item5<br>
</div>

I would like to place layer2 on the left of item2 in layer1. How would
I know the position of item2?


You would need to position both of them.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #2

P: n/a
John wrote:
I would like to know how I can be able to know the position of an
image or a div tag. My aim is to to put layers in any position I want
to, relative to an image or a div tag. For example If I have the
following code

[snip]

Brian's answer is probably what you needed, but I'll add this in case you want
more. It is a scripted way of placing absolutely-positioned divs relative to
images, as a Dreamweaver extension.
http://www.projectseven.com/extensio...s/snapinfo.htm
http://www.projectseven.com/extensions/index.htm

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/
Jul 20 '05 #3

P: n/a
Brian <us*****@julietremblay.com.invalid> wrote in message news:<10*************@corp.supernews.com>...
John wrote:
<div id=layer1>
item1<br>
item2<br>
item3<br>
</div>

<div id=layer2>
item4<br>
item5<br>
</div>

I would like to place layer2 on the left of item2 in layer1. How would
I know the position of item2?


You would need to position both of them.

I am creating the layers at run time so I can't know which position
they are going to be. What I would like to do here is to place some
layers relative to items which had been generated earlier on.
Jul 20 '05 #4

P: n/a
John wrote:
Brian wrote...
I would like to place layer2 on the left of item2 in layer1. How
would I know the position of item2?
You would need to position both of them.


I am creating the layers


I don't really know what you mean by layers. It would help to be more
precise. <layer> was, iirc, a Netscape proprietary element that died a
quick death.
at run time so I can't know which position they are going to be. What
I would like to do here is to place some layers relative to items
which had been generated earlier on.


Whether the page is dyamic or not really doesn't matter. You'll have to
position e.g. <div class="layer2"> in order to be absolutely (heh!)
certain of where it is.

Note that positioning elements absolutely is fraught with problems. It
can be done, but tred carefully. Or perhaps consider a layout that is
simpler and easier.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #5

P: n/a
Brian wrote:
John wrote:

[snip]
I am creating the layers


I don't really know what you mean by layers. It would help to be more
precise. <layer> was, iirc, a Netscape proprietary element that died a
quick death.

[snip]

For information (it may be relevant here).

"Layer" is a Dreamweaver synonym / shorthand for "absolutely positioned div".
Create a DW layer & you get a div with property { position: absolute }. Create
a div & give it property { position: absolute } and it will appear in the
"Layers" panel. (There are subtleties that probably don't really matter. Other
absolutely positioned elements also appear in the "Layers" panel).

DW doesn't use the word to mean the Netscape element.

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/
Jul 20 '05 #6

P: n/a
Barry Pearson wrote:

"Layer" is a Dreamweaver synonym / shorthand for "absolutely
positioned div". Create a DW layer & you get a div with property {
position: absolute }. Create a div & give it property { position:
absolute } and it will appear in the "Layers" panel.


(sigh) Unless one is using z-positioning or overlapping stuff, I can't
really see how it is a layer. No matter, at least I know something about
DW now.

Still, if someone posts here and uses the term layer, it may be
necessary to clarify if they mean a DW "layer" or <layer>.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #7

P: n/a
Brian wrote:
Barry Pearson wrote:

"Layer" is a Dreamweaver synonym / shorthand for "absolutely
positioned div". Create a DW layer & you get a div with property {
position: absolute }. Create a div & give it property { position:
absolute } and it will appear in the "Layers" panel.
(sigh) Unless one is using z-positioning or overlapping stuff, I can't
really see how it is a layer. No matter, at least I know something
about DW now.


One of the columns in the Layers panel is the z-value. So that is, indeed, one
of the purposes. Another column controls the visibility of individual layers.
You can select a layer in the panel, then drag it and/or resize it on the
design-view display and DW will change the relevant CSS properties for those.
And there is an option to prevent overlap. So it can be used as a simple way
of adjusting the sort of CSS properties you mention. In effect, it is a
different way of editing the CSS when doing absolute-positioning. I haven't
needed that, because I just edit the CSS directly for those purposes, but I
can imagine using it for gross-control, then fine-tuning the CSS values later.

But one of the main uses for layers in DW is for JavaScripted behaviour. For
example, show/hide a layer on some event, such as hovering over a link. There
are some built-in DW behaviours, plus lots more available as extensions. It is
typically true that if you make something into a layer, someone, somewhere,
has already written an extension that will enable you to link a desired
behaviour to it. "Layer" then acts as the unifying concept that all of these
work with.

But you can use DW "for ever" without having to know about its use of layers.
I typically type in the HTML & CSS for absolutely-positioned divs directly. It
depends on your preferred workflow.
Still, if someone posts here and uses the term layer, it may be
necessary to clarify if they mean a DW "layer" or <layer>.


Yes. (And there may be other uses, of course). Although the thought of someone
still using <layer> asking questions in a stylesheets NG is a bit of a
stretch! Has there ever been a W3C specification that supported <layer> and
CSS?

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/
Jul 20 '05 #8

This discussion thread is closed

Replies have been disabled for this discussion.