Fix a few small issues and switch screen.addEventListener to window.addEventListener because the former doesn't work on (at least) chrome/chromium

This commit is contained in:
Kevin MacMartin 2015-07-02 16:26:35 -04:00
parent 5569077384
commit 46380fbaa9

View file

@ -76,7 +76,7 @@
<body>
<script>
var video = '<video id="video" autoplay muted loop><source src="http://wny.s3.amazonaws.com/videos/TheenclosureoftheNextGenerationTransitSurvey.webm" type="video/webm"><source src="http://wny.s3.amazonaws.com/videos/TheenclosureoftheNextGenerationTransitSurvey.mp4" type="video/mp4"></video>';
var demo = function(id, valign, halign) {
var demo = function(id, verticalAlign, horizontalAlign) {
var v = document.getElementById('video');
if (v !== null) v.parentNode.removeChild(v);
document.body.innerHTML += video;
@ -88,14 +88,14 @@
id: 'video',
height: '720',
width: '1280',
valign: valign,
halign, halign,
valign: verticalAlign,
halign, horizontalAlign
});
window.onresize = contain.update;
screen.addEventListener('orientationchange', contain.update);
window.addEventListener('orientationchange', contain.update);
// ----- Relevant code above ----- //
}
};
window.onload = function() {
demo('demo5', 'center', 'center');
@ -105,21 +105,16 @@
<div class="buttons">
<div class="demo">
<h1>Contain Element</h1>
<p>
A JavaScript plugin to contain an element within its parent element.
</p>
<p>A JavaScript plugin to contain an element within its parent element.</p>
<ul>
<li><a href="https://github.com/WilliamsNY/contain-element">Download On GitHub</a></li>
</ul>
<ul><li><a href="https://github.com/WilliamsNY/contain-element">Download On GitHub</a></li></ul>
<hr>
<hr />
<p>
<i>
The video in the background is the example.
<br/>Change the positioning below and resize your browser to compare.
</i>
<em>The video in the background is the example.</em>
<br />
<em>Change the positioning below and resize your browser to compare.</em>
</p>
<div class="button" id="demo1" onclick="demo('demo1', 'top', 'left');">top left</div>