Skip to content

Instantly share code, notes, and snippets.

@skydriver
Last active December 31, 2015 21:19
Show Gist options
  • Save skydriver/8045611 to your computer and use it in GitHub Desktop.
Save skydriver/8045611 to your computer and use it in GitHub Desktop.
jQuery lib to center the div
/**
* jQuery Lib - Plugin to center a div on the screen.
*
* @author: Damjan Krstevski
* @team: codeart
* @contact: damjan@codeart.mk
* @tags: center, responsive, popup, fixed, optin, lightbox
-> Usage
$(document).ready(function(e) {
// Use $('body').find(selector) for hidden and absolute elements
$('body').find('#my-div').centerdiv();
});
**/
(function ( $ ) {
// Plugin definition.
$.fn.centerdiv = function( options ) {
// Create callback function
$.fn.codeart_center_func = function() {}
var _codeart_center_div_func = function( div ) {
// Set css to set the element position
div.css('position', 'fixed');
div.css('top', ($(window).height() / 2) - (div.outerHeight() / 2));
div.css('left', ($(window).width() / 2) - (div.outerWidth() / 2));
return div;
}
// Get instance
var div_ready_to_be_centered = this;
// Center div on window resize
_codeart_center_div_func(div_ready_to_be_centered);
// Append callback function on window resize event
$(window).on('resize', function() {
_codeart_center_div_func(div_ready_to_be_centered);
});
return this;
};
}( jQuery ));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment