JavaScript
Article
By Sam Deering

jQuery Center Web Page (Vertical and Horizontal)

By Sam Deering

jQuery code snippet to jQuery Center Web Page or any element both vertically and horizontally. Could be used with an event function to center a Web Page on screen at all times even when the window is resized.

--ADVERTISEMENT--

jQuery.fn.center = function() {
  this.css("position", "absolute");
  this.css("top", ($(window).height() - this.height()) / 2 + $(window).scrollTop() + "px");
  this.css("left", ($(window).width() - this.width()) / 2 + $(window).scrollLeft() + "px");
  return this;
};
Recommended
Sponsors
The most important and interesting stories in tech. Straight to your inbox, daily. Get Versioning.
Login or Create Account to Comment
Login Create Account