Advanced Search

Return to Snippet

Revision: 20762
at November 24, 2009 14:10 by jamalrob
Initial Code 
// *********************************************
	// CENTER AN ELEMENT IN THE CLIENT'S WINDOW
	//
	$.fn.centerInClient = function(options) {
		/// <summary>Centers the selected items in the browser window. Takes into account scroll position.
		/// Ideally the selected set should only match a single element.
		/// </summary>    
		/// <param name="fn" type="Function">Optional function called when centering is complete. Passed DOM element as parameter</param>    
		/// <param name="forceAbsolute" type="Boolean">if true forces the element to be removed from the document flow 
		///  and attached to the body element to ensure proper absolute positioning. 
		/// Be aware that this may cause ID hierachy for CSS styles to be affected.
		/// </param>
		/// <returns type="jQuery" />
		var opt = { forceAbsolute: false,
					container: window,    // selector of element to center in
					completeHandler: null
				  };
		$.extend(opt, options);
	
		return this.each(function(i) {
			var el = $(this);
			var jWin = $(opt.container);
			var isWin = opt.container == window;
	
			// force to the top of document to ENSURE that 
			// document absolute positioning is available
			if (opt.forceAbsolute) {
				if (isWin)
					el.remove().appendTo("body");
				else
					el.remove().appendTo(jWin.get(0));
			}
	
			// have to make absolute
			el.css("position", "absolute");
	
			// height is off a bit so fudge it
			var heightFudge = isWin ? 2.0 : 1.8;
	
			var x = (isWin ? jWin.width() : jWin.outerWidth()) / 2 - el.outerWidth() / 2;
			var y = (isWin ? jWin.height() : jWin.outerHeight()) / heightFudge - el.outerHeight() / 2;
	
			el.css("left", x + jWin.scrollLeft());
			el.css("top", y + jWin.scrollTop());
	
			// if specified make callback and pass element
			if (opt.completeHandler)
				opt.completeHandler(this);
		});
	}
	// *********************************************
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Center an element in a client's window (eg. modal box)

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
jQuery