473,466 Members | 1,531 Online
Bytes | Software Development & Data Engineering Community
Create Post

Home Posts Topics Members FAQ

get element location

I am working on a drag/drop script and what I am trying to do is change
the background of a div tag if I move the mouseover it while doing the
drag and drop.

Does anyone know of a script/know how to detect what elements are on a
web page, givin only the co-ordindates of event.pagex and event.pagey ?

Mar 31 '06 #1
4 7029
da********@gmail.com said on 31/03/2006 11:54 AM AEST:
I am working on a drag/drop script and what I am trying to do is change
the background of a div tag if I move the mouseover it while doing the
drag and drop.

Does anyone know of a script/know how to detect what elements are on a
web page, givin only the co-ordindates of event.pagex and event.pagey ?


You can't ask the browser what DOM objects are above/below some point.
You have to get the location and coverage of objects on your page and
store them - and update them whenever they change.

As you drag stuff around, check whether you are over one of your
registered zones. The usual trick is add a body onmousemove attribute
when you get a mousedown from a 'draggable' object, then remove it when
the object is 'dropped'. The rough algorithm is:

onload, find and register all the draggable and droppable elements.

Whenever you get a mousedown on a draggable element, monitor where the
cursor goes until you get a mouse up. Probably move a representation of
the draggable object in sync with the cursor position.

While the mouse button is down, if the cursor goes over a drop zone, let
the user know.

When the draggable object is dropped, work out what to do based on
whether it was over a drop zone at the time or not. Usually if it was
not over a drop zone, return it to its original position. If it was
over a drop zone, do something else.
--
Rob
Mar 31 '06 #2
Thanks for your response. part of the fun I am having is the elements
are not on the page when the onload event is fired.

Mar 31 '06 #3
da********@gmail.com said on 31/03/2006 3:25 PM AEST:
Thanks for your response. part of the fun I am having is the elements
are not on the page when the onload event is fired.


That makes life easier - register them as they are added.
--
Rob
Mar 31 '06 #4
da********@gmail.com wrote:
Does anyone know of a script/know how to detect what elements are on a
web page, givin only the co-ordindates of event.pagex and event.pagey ?


IE has document.elementFromPoint(x,y), but Mozilla/Firefox do not.
However, there is a quite interesting thread on simulating IE's
functionality at:
http://www.codingforums.com/showthread.php?t=21674

Csaba Gabor from Vienna

Mar 31 '06 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

10
by: Noah Spitzer-Williams | last post by:
Hello guys, I'm itinerating through my array using pointers in this fashion: image is unsigned char image do { cout << "image byte is: " << *image << endl;
1
by: jeffg | last post by:
I have a DIV that needs to give the user the ability to grab its right border to resize the width of the block. I know that CSS supports properties such as cursor : col-resize to provide the...
3
by: Samem N via DotNetMonster.com | last post by:
Does anyone know how to solve this error? I dont know where it went wrong. Any help would be appreciated .Thanks ERROR ______ Description: An unhandled exception occurred during the execution...
4
by: spivee | last post by:
I'm having an odd type of issue. I want to be able to pass an element name in my javascript event and find the location of the element, be it a div, span, img whatever, specifically the top and...
0
by: qwix | last post by:
Hi, after hours spent Googling I'm undone. What I need is to create a XML schema allowing some element to contain any XHTML element(s). This is my XML file I'm trying to validate according to...
4
by: Alan T | last post by:
I used XmlDocument to load from a file. Then how do I append an element to the end? <files> <file> <name>graphic.txt</name> <location>c:\temp</location> </file>
1
by: JavaXMLDev | last post by:
Hi I'm new to XML schema work, but wondered how, if at all possible, can you specify a relationship between the values of an element's attributes. Essentially I want context sensitive...
1
by: alexvodovoz | last post by:
Hi, I have been struggling with this for the past couple of days. We have a custom http module setup in our project to filter some requests. I only want this module to be applied to certain...
2
by: alexvodovoz | last post by:
Hi, I have been struggling with this for the past couple of days. We have a custom http module setup in our project to filter some requests. I only want this module to be applied to certain...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
1
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...
0
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
0
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.