<?xml version="1.0" standalone="yes"?>
<svg xmlns = "http://www.w3.org/2000/svg" width="100%" height="100%">
	<title>Mirror writing</title>
	<style type="text/css">
	*{ margin: 0; padding: 0 }
	iframe{ border: 0 }
	</style>
	<g>
		<foreignObject id="foreign" width="100%" height="100%">
			<body xmlns="http://www.w3.org/1999/xhtml" style="width: 100%; height: 100%" onresize="magic()">
				<iframe src="http://neo.infeo.pl"></iframe>
			</body>
			
			<div xmlns="http://www.w3.org/1999/xhtml" style="width: 100%; height: 100%">test</div>
		</foreignObject>
	</g>
	
	<script type="text/javascript">
	var body = document.getElementsByTagName('div')[0];
	var foreign = document.getElementsByTagName('foreignObject')[0];
	var iframe = document.getElementsByTagName('iframe')[0];
	var g = document.getElementsByTagName('g')[0];
	function magic(){
		width = body.offsetWidth;
		height = body.offsetHeight;
			
		
		//g.setAttribute('transform', 'skewX(-20)'); // skew...
		
		//g.setAttribute('transform', 'rotate(180,'+width/2+','+height/2+')');
		
		g.setAttribute('transform', 'scale(-1, 1) translate(-'+width+',0)'); // mirror ;]
		
		iframe.setAttribute('style', 'width:'+width+'px;height:'+height+'px');
	}
	
	//i = 0;
	//setInterval(function(){i++; g.setAttribute('transform', 'rotate('+i+','+width/2+','+height/2+')')}, 10);
	
	magic();
	</script>
</svg>

