Skip Navigation LinksHome > Projects > jQuery > Plugins > CenterIt

CenterIt

About the plugin

Version shown here is not the latest version, due to time restrictions I havent been able to update this page.

CenterIt is great for popup divs.
It takes into consideration margins, padding and the size of its child elements no matter if it is an image or another div.
Unlike nearly all other plugins that help with this, when you resize, or scroll down the page the popup will stay in the centre of the browser window.

Implementation

CenterIt can be applied to any elements.

There are two properties, as below:

ignorechildren: if set to false it will look for the biggest VISIBLE child element and use that to help centralise the popup.
This is down so it is possible to use the popup to display a popup image rotator or gallery, you can then easily change the image shown and the other div wrapper with be able to resize itself to suit the current content shown.
This feature was a request from an avid user: blah d blah design ltd

showPopup: by default is set to True, but it you set it to false it will not show the element, and you will have to do this manually. This was a change requested by one of the users of CenterIt.

Demos

Image Demo

Markup

<img id="imageDemo" src="./images/dv.jpg" />

Script

<span onclick="$('#popup').CenterIt();"/>View</span/>

Live Demo

Click the button to see the popup

View

More details, sample code and working examples
to download coming soon