Center An Element Horizontally and Vertically with jQuery V-ACenter Plugin

Center An Element Horizontally and Vertically with jQuery V-ACenter Plugin
File Size: 3.22 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

V-ACenter is a jQuery plugin for responsive layout that keeps an Html elements centered in the middle of the page regardless of browser size.

See also:

How to use it:

1. Load jQuery library and the jQuery V-ACenter plugin in the document.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jquery.center.js"></script>

2. Create an Html element that will be centered vertically and horizontally.

<div class="content">

Your content goes here

</div>

3. Call the plugin on the Html element.

$(window).bind({
load: function() {
$('.content').middleIt();
},
resize: function() {
$('.content').middleIt();
}
});

This awesome jQuery plugin is developed by youngdze. For more Advanced Usages, please check the demo page or visit the official website.