Click here to Skip to main content
12,827,730 members (46,938 online)
Click here to Skip to main content
Add your own
alternative version

Tagged as

Stats

4.3K views
1 bookmarked
Posted 5 Mar 2012

jQuery Relative Position Plugin - nextTo

, 5 Mar 2012 CPOL
Rate this:
Please Sign up or sign in to vote.
jQuery relative position plugin - nextTo

The Problem

I've already created quite a few jQuery plugins in the past, at work, and for personal use, and in many of them, there are certain parts of code that always tend to repeat themselves.

One of these parts of code has to do with element positioning calculations relative to another element.
For example, when creating a plug in for a drop-down menu, or a tooltip, you can't avoid having a nasty piece of code in there, that all it does is calculate the element's position relative to the element we clicked on or hovered above.

I don't think there's any need for me to post an example of this, you probably know what I mean. This is usually the least most maintainable part of code in the plug in and the least easy to understand.

The Solution

I finally decided to extract this ugly piece of code into a nice jQuery plug in that will hold all the dirty work calculations, and will leave you with a nice, clean and understandable piece of code inside your plug in.

<script type="text/javascript">
    $(function() {
        $('.PutThisDiv').nextTo('.ThisOtherDiv', {position:'right', shareBorder:'top'});
    });
</script>

This plug in is hosted on Google code: https://code.google.com/p/next-to/ (project name: 'next-to')
At the project page, you will find more sample usages, usage explanations, the source code and a minified version.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Gilly Barr
Web Developer
Israel Israel
Started programming e-commerce sites with PHP & MySQL at the age of 14. Worked for me well for about 5 years.

Transfered to C# & asp.net, while serving in the IDF.
Worked on the 'Core Performance' Team at ShopYourWay.com (Sears Israel)
Currently working at Logz.io

Check out my blog!
or my twitter

You may also be interested in...

Comments and Discussions

 
-- There are no messages in this forum --
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.170326.1 | Last Updated 5 Mar 2012
Article Copyright 2012 by Gilly Barr
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid