Intersection of DIVS

sicapitan

Hi There :)

Is it possible to get the 4 corners where 2 dives intersect? I'm
making a table-ish system and som drag and drop elements need to snap
to the area intersecting between 2 divs.

I don't know if this is possible?

Aug 21 '06 #1

Subscribe Reply

3865

Randy Webb

sicapitan said the following on 8/21/2006 5:18 AM:

Hi There :)

Is it possible to get the 4 corners where 2 dives intersect? I'm
making a table-ish system and som drag and drop elements need to snap
to the area intersecting between 2 divs.

I don't know if this is possible?

Yes, quite possible. You need to know the top left corner of the two
divs (that is not trivial but you can use Matt Kruse's Object Position
library to find those):

<URL: http://www.javascriptt oolbox.com/lib/objectposition/>

After knowing the top left corners of both you go with the one that is
the "lowest" on the screen, meaning further down the page. Once you know
which is the lowest, you look to see which is the left most. If the
lower one is to the right, then you want the top and left of that Div to
be the top and left of your dropped element.

If the lower div is to the left, then you want the intersection of the
two divs. The top of the lower div and the left of the upper div will
give you the intersection point. That would be the top/left of your
dropped element.

You would need to check also to make sure the two div tags are
overlapped. That would require knowing the height and width of the divs.

P.S. Knowing the top and left of both divs you could even stretch/shrink
your dropped element to fit into the overlap box and fill it.

--
Randy
comp.lang.javas cript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

Aug 21 '06 #2

sicapitan

Ahhhh great, thanks Randy :) I plan to do this a number of times and
to build the divs in rows and columns which are configurable in width.
This library looks like just what I'm after. This is year 9 maths, I'm
surprised at myself for not thinking more on this one, thanks!

Randy Webb wrote:

sicapitan said the following on 8/21/2006 5:18 AM:
Hi There :)

Is it possible to get the 4 corners where 2 dives intersect? I'm
making a table-ish system and som drag and drop elements need to snap
to the area intersecting between 2 divs.

I don't know if this is possible?

Yes, quite possible. You need to know the top left corner of the two
divs (that is not trivial but you can use Matt Kruse's Object Position
library to find those):

<URL: http://www.javascriptt oolbox.com/lib/objectposition/>

After knowing the top left corners of both you go with the one that is
the "lowest" on the screen, meaning further down the page. Once you know
which is the lowest, you look to see which is the left most. If the
lower one is to the right, then you want the top and left of that Div to
be the top and left of your dropped element.

If the lower div is to the left, then you want the intersection of the
two divs. The top of the lower div and the left of the upper div will
give you the intersection point. That would be the top/left of your
dropped element.

You would need to check also to make sure the two div tags are
overlapped. That would require knowing the height and width of the divs.

P.S. Knowing the top and left of both divs you could even stretch/shrink
your dropped element to fit into the overlap box and fill it.

--
Randy
comp.lang.javas cript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

Aug 22 '06 #3

Similar topics

80980

Standard ways to get union, intersection, difference of lists?

by: Mickel Grönroos | last post by:

Hi! Are there any standard list methods for getting the intersection and difference of two lists? (The union is easy ("list1.extend(list2)"), unless you want it to contain unique values.) Here is what I would like to have: list1 = list2 =

Python

9172

intersection of 2 strings

by: Antoine Logean | last post by:

Hi, What is the easiest way to get the intersection of two strings in python (a kind a "and" operator) ? ex: string_1 = "the_car_of_my_fried_is_bigger_as_mine_but_my_girlfriend_is_more_beautifull" string_2 = "my_girlfriend_is_more_beautifull_and_has_blue_eyes"

Python

2781

efficient intersection of lists with rounding

by: Gordon Williams | last post by:

Hi, I have to lists that I need to find the common numbers (2nd rounded to nearest integral) and I am wondering if there is a more efficient way of doing it. >>> a= >>> b= >>> (l,round(m))]

Python

1830

XML Schema spec: Attribute Wildcard Intersection

by: Alain Frisch | last post by:

Hello, The following rule in the XML Schema spec, section "Schema Component Constraint: Attribute Wildcard Intersection" seems strange to me: ======================================= 3 If either O1 or O2 is a pair of not and a value (a namespace name or ·absent·) and the other is a set of (namespace names or ·absent·), then that set, minus the negated value if it was in the set, minus ·absent· if it was in the set, must be the value.

.NET Framework

3370

String Intersection

by: Sebastian Cohen S | last post by:

Hello, I am new to SQL and currently using Access 2003 and need a little help on the following. I have two queries each contains one column formed with a string that is very similar (only variying by few characters) to the other column as follows: QUERY1 QUERY2

Microsoft Access / VBA

17579

Rectangle intersection

by: kimos | last post by:

hi all, how to calculate the intersection of 2 rectangle a rectangle is the following: Rectangle makeRectangle (Point lowerLeft, Point upperRight) { Rectangle r;

C / C++

22459

Find the intersection of two rectangles

by: cai_rongxi | last post by:

Hi, Can some body share the code to find the intersection of two rectangles? Thanks in advance

C / C++

2317

How to subclass sets.Set() to change intersection() behavior?

by: mkppk | last post by:

I have kind of strange change I'd like to make to the sets.Set() intersection() method.. Normally, intersection would return items in both s1 and s2 like with something like this: s1.intersection(s2) I want the item matching to be a bit "looser".. that is, items in s2 that match to just the beginning of items in s1 would be included in the result of intersection().

Python

8561

fastest way to find the intersection of n lists of sets

by: Prateek | last post by:

I have 3 variable length lists of sets. I need to find the common elements in each list (across sets) really really quickly. Here is some sample code: # Doesn't make sense to union the sets - we're going to do intersections later anyway l1 = reduce(operator.add, list(x) for x in l1) l2 = reduce(operator.add, list(x) for x in l2) l3 = reduce(operator.add, list(x) for x in l3)

Python

8917

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

9426

Problem With Comparison Operator <=> in G++

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, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

9200

The easy way to turn off automatic updates for Windows 10/11

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 Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

9142

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

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 protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...

General

8148

AI Job Threat for Devs

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, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...

Career Advice

6722

Access Europe - Using VBA to create a class based on a table - Wed 1 May

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 presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

6022

Couldn’t get equations in html when convert word .docx file to html file in C#.

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 then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...

C# / C Sharp

2680

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP

2163

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General