nicholasruunu/gist:5704893

## gistfile1.html
<!DOCTYPE HTML>
<html>
<head>

  <meta name="author" content="Johnie Hjelm">
	<meta name="description" content="">
	<meta name="keywords" content="">

	<link rel="stylesheet" type="text/css" href="style.css">

	<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>Susy</title>

<meta charset="UTF-8" />
</head>

<body>

	<div class="page" id="one">
		<h1>
			Stycke 1
		</h1>
	</div>

	<div class="page" id="two">
		<h1>
			Stycke 2
		</h1>
	</div>

	<div class="page" id="three">
		<h1>
			Stycke 3
		</h1>
	</div>

	<script type="text/javascript" src="http://www.google.com/jsapi"></script><script type="text/javascript">google.load("jquery", "1");</script>

	<script>
		// Dessa värden kommer aldrig att förändras
		// eftersom de är cachade i variabler
		var windowHeight = $(window).height();
		var windowWidth = $(window).width();

		var page = $(".page");

		$(window).bind("load", function(){
			$(".page").css("height", windowHeight);
			$('h1').css({top:'50%',left:'50%',margin:'-'+($('h1').height() / 2)+'px 0 0 -'+($('h1').width() / 2)+'px'});
		});

		// Jag vill få .page ska resize:a proportionerligt med fönstret
		$(window).resize(function() {
		    // Du vill inte cacha storleken på fönstret utan använda
		    // det uppdaterade värdet
		    var $window = $(this);

		    page.css('height', $window.height());
		}).trigger('resize');

	</script>

</body>
</html>
	<!DOCTYPE HTML>
	<html>
	<head>

	<meta name="author" content="Johnie Hjelm">
	<meta name="description" content="">
	<meta name="keywords" content="">

	<link rel="stylesheet" type="text/css" href="style.css">

	<meta name="viewport" content="width=device-width, initial-scale=1.0" />

	<title>Susy</title>

	<meta charset="UTF-8" />
	</head>

	<body>

	<div class="page" id="one">
	<h1>
	Stycke 1
	</h1>
	</div>

	<div class="page" id="two">
	<h1>
	Stycke 2
	</h1>
	</div>

	<div class="page" id="three">
	<h1>
	Stycke 3
	</h1>
	</div>

	<script type="text/javascript" src="http://www.google.com/jsapi"></script><script type="text/javascript">google.load("jquery", "1");</script>

	<script>
	// Dessa värden kommer aldrig att förändras
	// eftersom de är cachade i variabler
	var windowHeight = $(window).height();
	var windowWidth = $(window).width();

	var page = $(".page");

	$(window).bind("load", function(){
	$(".page").css("height", windowHeight);
	$('h1').css({top:'50%',left:'50%',margin:'-'+($('h1').height() / 2)+'px 0 0 -'+($('h1').width() / 2)+'px'});
	});

	// Jag vill få .page ska resize:a proportionerligt med fönstret
	$(window).resize(function() {
	// Du vill inte cacha storleken på fönstret utan använda
	// det uppdaterade värdet
	var $window = $(this);

	page.css('height', $window.height());
	}).trigger('resize');

	</script>

	</body>
	</html>