Pouze tento týden sleva až 80 % na e-learning týkající se Pythonu
Aktuálně: Postihly zákazy tvou profesi? Poptávka po ajťácích prudce roste, využij podzimní akce 30% výuky zdarma!
October discounts

jQuery - video přehrávač

Nové technologie přinášejí mnho skvělých věcí. HTML5 nabízí také (krom jiného) tag video, který umožňuje přehrávat videa bez použití zásuvných modulů, jako je flash nebo java. Rozhodl jsem se, udělat si za pomoci jQuery vlastní nastavitelné uživatelské rozhraní. Tento jQuery plug-in umí vykreslit tlačítko přehrát/pozastavit, zobrazuje na slideru pozici aktuálně přehrávaného videa a umožňuje manuální přesun. Dále pak umí nastavovat hlasitost. Vše se dá ovládat pomocí klávesových zkratek. Plug-in používá jQuery UI.

Ukázka plug-inu

Tento výukový obsah pomáhají rozvíjet následující firmy, které dost možná hledají právě tebe!

Ukázka jQuery video přehrávače

Implementace:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="datepicker.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('video').dPlayer({
            width: 750,
            height: 400
        });
    });
</script>

Nastavení

.dPlayer({
    // Element pro video
    video: this,
    // Šířka videa
    width: 700,
    // Výška videa
    height: 420,
    // Automatické spuštění
    autoplay: false,
    // Opakovat ve smyčce
    loop: false,
    // Funkce po stuštění videa
    onPlay: function(){},
    // Funkce po pauznutí videa
    onPause: function(){},
    // Funkce po přehrání celého videa
    onComplete: function(){},
    // Fallback - textová zpráva pro uživatele, jejichž prohlížeč není podporován
    fallback: "Please, download a correct browser.",
    // Použít vstupy z klávesnice
    keyboardInput: true

});

Galerie


 

Stáhnout

Staženo 607x (19.02 kB)
Aplikace je včetně zdrojových kódů v jazyce JavaScript

 

Všechny články v sekci
JavaScript zdrojákoviště - jQuery
Program pro vás napsal Drahomír Hanák
Avatar
Jak se ti líbí článek?
1 hlasů
Autor v současné době studuje Informatiku. Zajímá se o programování, matematiku a grafiku.
Aktivity (1)

 

 

Komentáře

Avatar
Daniel Vítek
Redaktor
Avatar
Daniel Vítek:3.9.2012 17:56

mě trochu zlobí ta ukázková verze na tvém webu

Odpovědět
3.9.2012 17:56
Na síti působím už pěknou řádku let. Pokud budeš něco potřebovat, písni mi, pokusím se ti poradit :)
Tento výukový obsah pomáhají rozvíjet následující firmy, které dost možná hledají právě tebe!
Avatar
Drahomír Hanák
Redaktor
Avatar
Odpovídá na Daniel Vítek
Drahomír Hanák:3.9.2012 18:50

To je protože tam nejsou styly z jQuery UI. Jinak ten kód video přehrávače plánuji přepsat do nějaké čitelnější podoby.

 
Odpovědět
3.9.2012 18:50
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 2 zpráv z 2.