Yoda Condition

Will man im Backend von WordPress die Thickbox verwenden, bekommt man ein Problem. Zumindest dann, wenn man mit der vorgegebenen Größe nicht einverstanden ist. Die wird nämlich von WordPress mittels eines Scriptes vorgegeben. Bindet man zusätzlich den Editor ein, wird es richtig haarig. Denn im media-upload.js steht dummerweise die Zeile $('a.thickbox').each( function() {...}
Also alle Links mit der Klasse thickbox werden manipuliert. Würde man die Klasse thickbox weg lassen, würde der Link keine Thickbox öffnen. Blöde Situation das ganze.

Ich suchte eine Möglichkeit wie ich die Thickbox in ihrer Größe ändern kann, darüber hinaus mir aber keine Gedanken mehr machen muss wie groß ich sie dimensionieren soll. Die Thickbox sollte sich in ihrer Größe immer schön am dargestellten Inhalt ausrichten. Nach etlichen rumprobieren und etwas suchen, kam ich dann auf folgende Lösung:

jQuery(document).ready(
	function($){

		resize_thickbox_iframe();
/*
 *
 * some other jQuery code
 *
 */

		function resize_thickbox_iframe(){

			//padding
			var pad = 50;

			// give the body a height
			$( 'body' ).css( 'height', 'auto' );

			// read the bodys height and add some padding
			var mh = parseInt( $( 'body' ).height() ) + pad;

			var max_height = mh + 'px';

			// get the parent window dimensions
			var parent = $( window.parent.document );
			var ph = parent.height();

			// get the ID of this iframe and the iframe itself
			frame_id = frameElement.id;
			frame = $( '#'+frame_id, window.parent.document );

			// get the id of the overlay-div and the overlay-div itself
			div_id = frame.parent().attr( 'id' );
			div = $( '#'+div_id, window.parent.document );

			// first set the hight for the frame, than set the hight for the overlay-div
			frame.css( 'height', max_height );
			div.css( 'height', max_height );

			// calculate the new top position
			var tb = Math.round( ( ( ph - mh ) / 2 ) - pad ) + 'px';

			// set the new top position
			frame.css( 'top', tb );
			div.css( 'top', tb );

		}

	}
);

Das Script setzt die Höhe des body-Tags im iFrame zuerst auf ‘auto’ damit dieser eine Höhe bekommt (für den Fall das der body-Tag noch keine Höhe besitzt). Danach wird das iFrame aus dem Eltern-Dokument gefischt und seine Höhe angepasst. Da sich das iFrame allerdings innerhalb eines Overlay-Divs befindet, muss dieser ebenfalls aus dem DOM gefischt und angepasst werden. Zum Schluss werden Overlay-Div und iFrame neu ausgerichtet.

Das Script gehört in das iFrame hinein! Dementsprechend muss im iFrame auch noch jQuery geladen werden. Wer im iFrame auf jQuery verzichten kann, muss sihc die Funktion auf pures JavaScript umschreiben (ist auch nicht sooo schwer).