diff options
| author | Jesús Eduardo <heckyel@hyperbola.info> | 2017-07-15 16:06:57 -0500 |
|---|---|---|
| committer | Jesús Eduardo <heckyel@hyperbola.info> | 2017-07-15 16:06:57 -0500 |
| commit | d20da4f325a0545b8fc6da4a785bc8d87dd91487 (patch) | |
| tree | a2d6aea5ddec16a8d816c639001a519f8b878791 /example-hotkeys.html | |
| download | librevideojs-d20da4f325a0545b8fc6da4a785bc8d87dd91487.tar.lz librevideojs-d20da4f325a0545b8fc6da4a785bc8d87dd91487.tar.xz librevideojs-d20da4f325a0545b8fc6da4a785bc8d87dd91487.zip | |
First commit
Diffstat (limited to 'example-hotkeys.html')
| -rw-r--r-- | example-hotkeys.html | 105 |
1 files changed, 105 insertions, 0 deletions
diff --git a/example-hotkeys.html b/example-hotkeys.html new file mode 100644 index 0000000..fe3b628 --- /dev/null +++ b/example-hotkeys.html @@ -0,0 +1,105 @@ +<!DOCTYPE html> +<html lang="es"> + +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <meta http-equiv="X-UA-Compatible" content="ie=edge"> + <title>Reproductor LibreVideoJS</title> + <link rel="author" type="text/plain" href="humans.txt"> + <!--Favicon Libre--> + <link rel="shortcut icon" href="./images/gnu-linux_libre.png"> + <!-- Normalizador --> + <link href="./css/normalize.css" rel="stylesheet" type="text/css"> + <!--Begin | Estilos de la Página --> + <style> + body { + background-color: #141517; + color: white; + } + + h1, + h2, + h3 { + text-align: center; + } + + a { + text-decoration: none; + color: #189e7d; + } + + a:hover { + color: #1de9b6; + } + + .clase1 { + margin: 20px; + } + + p, + .clase2 { + margin: 20px; + } + + footer { + background-color: #1e1b1f; + text-align: center; + margin: 20px; + padding: 10px; + } + </style> + <!-- Ending | Estilos de la Página --> + <!-- LibreVideoJS - estilos --> + <link href="./css/default/cliplibre-js.dev.css" rel="stylesheet" type="text/css"> + <!--LibreVideoJS--> + <script src="./js/cliplibrejs.dev.js"></script> +</head> + +<body> + <h1> + Demo de LibreVideoJS trabajando con el plugin de hotkeys + </h1> + <article class="clase1"> + <h3>Vídeo de Software Libre</h3> + <video id="example" controls data-setup="{}"> + <source data-res="original" src="https://archive.org/download/libre848x476/libre640x480.ogv" type="video/ogg"> + <p class="no_html5">Lo siento, este navegador no soporta HTML 5. Por favor, cambia o actualiza tu navegador Web</p> + </video> + </article> + <div> + <h2>Instrucciones para hotkeys</h2> + <ul> + <li>FullScreen: F</li> + <li>Volumen: key [Up - Down]</li> + <li>Mute: M</li> + <li>Timeline: Next[Rigth], Prev[Left]</li> + <li>Timeline advance: 0%[key 0], 10%[key 1]..., 90%[key 9]</li> + </ul> + </div> + <!-- Hotkeys --> + <script> + // @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-v3-or-Later + // Insert class base + var estilos = document.getElementById("example"); + estilos.className += " cliplibre-js-responsive-container librevjs-hd cliplibre-js librevjs-default-skin"; + // funciones + cliplibrejs('#example').ready(function() { + this.hotkeys({ + volumeStep: 0.1, + seekStep: 5, + enableMute: true, + enableFullscreen: true, + enableNumbers: true + }); + }); + // @license-end + </script> + <footer> + Basado en VideoJS, depurado y escrito por Jesús Eduardo en el año 2016 - <span id="year"></span>. + </footer> + <!-- Script NO necesario | solo para la fecha --> + <script src="./js/fecha.js"></script> +</body> + +</html> |