kevin/contain-element
1
0
Fork 0
mirror of https://github.com/WilliamsNY/contain-element.git synced 2024-11-23 14:14:10 -05:00
Code Issues Projects Releases Packages Wiki Activity

Adding some text to explain what to do in this demo.

Browse source
This commit is contained in:
Luke Evers 2015-07-01 14:23:58 -04:00
parent f65377b30b
commit 4fa00ad98d
1 changed files with 19 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
index.html
View file

@ -28,6 +28,13 @@
list-style: none;
}
hr {
max-width: 300px;
border: 0;
border-bottom: 1px solid #f6f6f6;
opacity: .5;
}
.buttons {
position: fixed;
display: table;
@ -75,6 +82,7 @@
document.getElementsByClassName('active')[0].className = 'button';
document.getElementById(id).className = 'button active';
// ------ Relevant code below ----- //
var contain = new ContainElement({
id: 'video',
height: '720',
@ -85,6 +93,7 @@
window.onresize = contain.update;
screen.addEventListener('orientationchange', contain.update);
// ----- Relevant code above ----- //
}
window.onload = function() {
@ -96,12 +105,21 @@
<div class="demo">
<h1>Contain Element</h1>
<p>
A JavaScript plugin to contain an element within its parent element
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>
<hr>
<p>
<i>
The video in the background is the example.
<br/>Change the positioning below and resize your browser to compare.
</i>
</p>
<div class="button" id="demo1" onclick="demo('demo1', 'top', 'left');">top left</div>
<div class="button" id="demo2" onclick="demo('demo2', 'top', 'center');">top center</div>