Files
2013-05-13 21:15:17 +01:00

53 lines
1.4 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Media Query test</title>
<meta name="viewport" content="width=device-width">
<script type="text/javascript" src="js/libs/modernizr.js"></script>
<link rel="stylesheet" href="css/test-suite.css">
</head>
<body>
<div class="main center">
<h1>Enquire.js Test Suite</h1>
<h2>Simple automated functional tests</h2>
<!-- this gets programmatically resized to trigger media queries -->
<iframe id="suite" src="test-suite.html" frameborder="0" height="600" width="550">
</iframe>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script>
(function($) {
function queueResizes($target, sizes, attr, step) {
var i = 0;
step = step || 600;
attr = attr || "width";
function factory(size) {
return function() {
$target.css(attr, size);
}
}
for(i = 0; i < sizes.length; i++) {
setTimeout(factory(sizes[i]), (i + 1) * step);
}
}
$(function() {
queueResizes($("#suite"), [400, 650, 550]);
});
}(jQuery));
</script>
</body>
</html>