jQuery Plugin To Center An Html Element Responsively - jQuery Center

File Size: 4.09KB
Views Total: 1328
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Center An Html Element Responsively - jQuery Center

jQueryCenter is a small yet useful jQuery plugin that allows to center Html elements (like div, image, text, etc.) horizontally, vertically and responsively, without writing any CSS rules. 

How to use it:

1. Create an Html element that you want to center it in the page.

<div id="center"> 
<img id="caption-blur" src="http://lorempixel.com/300/200/fashion"> 
</div>

2. Load the jQuery library and jQueryCenter plugin at the bottom of the page.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="center.js"></script>

3. Initialize the plugin. That's it.

<script type="text/javascript">
jQuery(document).ready(function($) {
$("#center").center();
});
</script>

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