Kamala - Wordpress Themes - Record Songs for free - Kamala Harris - Sport Betting Systems

PDA

View Full Version : AJAX Modal Box Positioning


thrillseeker30
Apr 26th 2009, 4:04 pm
Hey guys, I'm learning how to validate a form field using Javascript/PHP being passed asynchronously.

However, I'm stuck with trying to position the modal box in the center of the screen. With the following code, it positions the modal box too far down, and too far from the left:

function overlay() {

var modal_window = document.getElementById("modal_window");
var modal_background = document.getElementById("modal_background");

var windowHeight = window.innerHeight;
var windowWidth = window.innerWidth;

var divHeight = modal_window.clientHeight;
var divWidth = modal_window.clientWidth;

modal_window.style.top = (windowHeight/2) - (divHeight/2) + "px";
modal_window.style.left = (windowWidth/2) - (divWidth/2) + "px";
}

Any thoughts of how I can improve this bit of code or how to accurately calculate the center of any browser window.

Thanks guys!

JavaScriptBank.com
Apr 27th 2009, 11:26 pm
you can view source code of scripts below for your problem:

- Center Window in all resolutions and Alway on Top (http://www.javascriptbank.com/javascript/snippet/center-window-in-all-resolution-and-alway-on-top/detail/)
- Content Center (http://javascriptbank.com/javascript/browser/page-effect/content-center/detail/)