ZetaBoards mobile ads. Requires jQuery.

zbmobile.js

/*
 * This is free and unencumbered software released into the public domain.
 * 
 * Anyone is free to copy, modify, publish, use, compile, sell, or
 * distribute this software, either in source code form or as a compiled
 * binary, for any purpose, commercial or non-commercial, and by any
 * means.
 */
{
	var main = $('#main');
	var ads = $('#main>table').filter(function() {
		// Select all <table> elements not having an ID or class.
		return !this.id && !this.className;
	});

	function scaleAd(ad, i) {
		// For each ad element, individually calculate the scaling factor.
		var scale = main.width() / ad.width();

		// Avoid stretching the ad to make it bigger than the original size.
		if (scale > 1) {
			scale = 1;
		}

		// Do we need to adjust scaling?
		if (ad.data('scale') == scale) {
			// Abort to avoid unnecessary redrawing.
			return;
		} else {
			// Store the current scale.
			ad.data('scale', scale);
		}

		// Set the origin to the top left.
		ad.css('-ms-transform-origin', 'top left');
		ad.css('-moz-transform-origin', 'top left');
		ad.css('-o-transform-origin', 'top left');
		ad.css('-webkit-transform-origin', 'top left');
		ad.css('transform-origin', 'top left');

		// Apply the scaling factor.
		ad.css('-ms-transform', 'scale(' + scale + ')');
		ad.css('-moz-transform', 'scale(' + scale + ')');
		ad.css('-o-transform', 'scale(' + scale + ')');
		ad.css('-webkit-transform', 'scale(' + scale + ')');
		ad.css('transform', 'scale(' + scale + ')');

		// Compensate for the reduced height by setting a negative margin-bottom.
		ad.css('margin-top', '0');
		ad.css('margin-bottom', (ad.height() * (scale - 1)) + 'px');

		// Log the resize.
		//console.log('ad ' + i + ' scaled to ' + scale);
	}

	// Trigger ad scaling on window resize.
	windowTimer = 0;
	window.onresize = function() {
		// Scale ads 50ms after resize finishes.
		clearTimeout(windowTimer);
		windowTimer = setTimeout(function() {
				ads.each(function(i) {
				scaleAd($(this), i);
			});
		}, 50);
	}

	// Trigger ad scaling on ad contents resize.
	ads.each(function(i) {
		// Get the ad and contents.
		var ad = $(this);
		var td = ad.find('td').first();

		// Insert a watcher iframe.
		var timer = 0;
		$('<iframe/>').css({
			display: 'block',
			width: '100%',
			height: '0',
			border: 'none',
			visibility: 'hidden'
		}).prependTo(td)[0].contentWindow.onresize = function() {
			// Scale ad 50ms after resize finishes.
			clearTimeout(timer);
			timer = setTimeout(function() {
				scaleAd(ad, i);
			}, 50);
		};
	});
}