diff options
| -rw-r--r-- | player.php | 8 | ||||
| -rw-r--r-- | playerstyle.css | 33 | ||||
| -rw-r--r-- | settings.js | 2 |
3 files changed, 32 insertions, 11 deletions
@@ -15,8 +15,10 @@ $loop = ($_GET['loop'] != "0"); <a id="loop0" href="<?php echo $params; ?>&loop=0"<?php if (!$loop) echo ' style="font-weight: bold"'; ?>>[play once]</a> <a id="loop1" href="<?php echo $params; ?>&loop=1"<?php if ($loop) echo ' style="font-weight: bold"'; ?>>[loop]</a> </div> - <video controls<?php if ($loop) echo ' loop'; ?> src="<?php echo htmlspecialchars($_GET['v']); ?>"> - Your browser does not support HTML5 video. - </video> + <div id="playercontent"> + <video controls<?php if ($loop) echo ' loop'; ?> src="<?php echo htmlspecialchars($_GET['v']); ?>"> + Your browser does not support HTML5 video. <a href="<?php echo htmlspecialchars($_GET['v']); ?>">[Download]</a> + </video> + </div> </body> </html> diff --git a/playerstyle.css b/playerstyle.css index 44d73757..efb570bb 100644 --- a/playerstyle.css +++ b/playerstyle.css @@ -1,19 +1,38 @@ body { background: black; color: white; -} -video { - display: block; - margin-left: auto; - margin-right: auto; + margin: 0px; } #playerheader { + position: absolute; + left: 0px; + right: 0px; + top: 0px; + height: 24px; + padding: 0px 4px; text-align: right; + font-size: 16px; } #playerheader a { color: white; text-decoration: none; } -span.settings { - position: relative; +span.settings div { + background: black; + z-index: 1; + padding-right: 4px; +} +#playercontent { + position: absolute; + left: 0px; + right: 0px; + top: 24px; + bottom: 0px; +} +video { + display: block; + margin-left: auto; + margin-right: auto; + max-width: 100%; + max-height: 100%; } diff --git a/settings.js b/settings.js index 54765190..e349b8ab 100644 --- a/settings.js +++ b/settings.js @@ -17,7 +17,7 @@ setDefault("videomuted", false); var settingsMenu = document.createElement("span"); settingsMenu.className = "settings"; settingsMenu.innerHTML = '<span>[Settings]</span>' - + '<div style="display: none; text-align: left; position: absolute; right: 0px; margin-left: -999em;">' + + '<div style="display: none; text-align: left; position: absolute; right: 0px; margin-left: -999em; margin-top: -1px;">' + '<label><input type="checkbox" name="videoexpand">Expand videos inline</label><br>' + '<label><input type="checkbox" name="videohover">Play videos on hover</label><br>' + '<label><input type="checkbox" name="videomuted">Open videos muted</label><br>' |