Skip to content

Instantly share code, notes, and snippets.

@0t3dWCE
Last active November 19, 2015 13:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save 0t3dWCE/a882717f20aba0ce58c4 to your computer and use it in GitHub Desktop.
Save 0t3dWCE/a882717f20aba0ce58c4 to your computer and use it in GitHub Desktop.
stas.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<!--link rel="stylesheet" href="table.css"-->
<style>
body {
font-family: sans-serif;
font-size: medium;
}
table {
border: 2px solid black;
width: 60%;
border-collapse: collapse;
margin: auto;
}
th {
border: 2px solid black;
}
td {
border: 2px solid black;
text-align: center;
}
caption {
font-size: 150%;
font-style: italic;
font-weight: bold;
}
video#bgvid {
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url(http://www.lboro.ac.uk/media/wwwlboroacuk/external/co..) no-repeat;
background-size: cover;
}
</style>
<title>Итоги соревнований</title>
</head>
<body>
<table>
<caption>Итоги соревнований по ОФП Фадеева Станислава</caption>
<tr>
<th rowspan="4">полугодие</th>
<th rowspan="4">год</th>
<th colspan="8">виды упражнений</th>
<th colspan="2" rowspan="3">итог</th>
</tr>
<tr>
<th colspan="2">пресс</th>
<th colspan="2">прыжок(сек)</th>
<th colspan="2">вис(сек)</th>
<th colspan="2">челнок(сек)</th>
</tr>
<tr>
<th colspan="2">за 1 мин</th>
<th colspan="2">с места</th>
<th colspan="2">на перекладине</th>
<th colspan="2">3x10</th>
</tr>
<tr>
<th>результат</th>
<th>место</th>
<th>результат</th>
<th>место</th>
<th>результат</th>
<th>место</th>
<th>результат</th>
<th>место</th>
<th>результат</th>
<th>место</th>
</tr>
<tr>
<td>1</td>
<td>2015</td>
<td>34</td>
<td></td>
<td>141</td>
<td></td>
<td>15</td>
<td></td>
<td>9.31</td>
<td></td>
<td></td>
<td>13/32</td>
</tr>
<tr>
<td>2</td>
<td>2015</td>
<td>34</td>
<td>10</td>
<td>135</td>
<td>12</td>
<td>11</td>
<td>11</td>
<td>8.9</td>
<td>13</td>
<td>46</td>
<td>9/36</td>
</tr>
<tr>
<button id="vidpause">Pause</button>
</tr>
<video autoplay loop poster="http://www.lboro.ac.uk/media/wwwlboroacuk/external/co.." id="bgvid">
<source src="http://video.webmfiles.org/big-buck-bunny_trailer.webm" mtype="video/webm">
</video>
</table>
<script>
var vid = document.getElementById("bgvid"),
pauseButton = document.getElementById("vidpause");
function vidFade() {
vid.classList.add("stopfade");
}
vid.addEventListener('ended', function() {
// only functional if "loop" is removed
vid.pause();
// to capture IE10
vidFade();
});
pauseButton.addEventListener("click", function() {
vid.classList.toggle("stopfade");
if (vid.paused) {
vid.play();
pauseButton.innerHTML = "Pause";
} else {
vid.pause();
pauseButton.innerHTML = "Paused";
}
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment