Lightweight jQuery Plugin To Centralize DOM Elements - CenterIt

File Size: 3.49 KB
Views Total: 407
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Lightweight jQuery Plugin To Centralize DOM Elements - CenterIt

CenterIt is a lightweight yet fully configurable jQuery plugin that enables you to vertically (horizontally or both) centralize a DOM element within a given container.

How to use it:

1. Make sure to include the centerit plugin after you have jQuery loaded.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jquery.centerIt.js"></script>

2. Make a DOM element centered and fixed relative to body element.

$('#container').centerIt({
  position: 'fixed'
});

3. Disable horizontal or vertical centering.

$('#container').centerIt({
  position: 'fixed',
  horizontal: false,
  // vertical: false
});

4. Full configuration options with default values.

$('#container').centerIt({

  // parent container
  parent: 'body',

  // enable vertical centering
  vertical: true,

  // enable horizontal centering
  horizontal: true,

  // auto event listener
  autoListener: true,

  // CSS position
  position: 'absolute'
  
});

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