Telepítése és konfigurálása Flowplayer lejátszó

A nevem Victor Gavrilenko, az oktatási Mérnök vagyok villanyszerelő. Bár még az egyetemen kezdtem, hogy vegyenek részt a számítástechnika és a programozás, két évig intenzíven részt vesz a fejlesztési weboldalak és webes programozás. Hobbim írunk kis scripteket nyelv PHP, összefüggésben adatbázisok MySQL, SQLite, jó tudni, hogy az ilyen motorok, mint a WordPress, Drupal, Joomla.






támogatja a több média formátumok - FLV, SWF, MP4, H.264 video, MP3 JPG, PNG;

Teljes mértékben támogatja a HTML5, ami különösen fontos ebben az időben;

sok különböző beállításokat;

Ha a lejátszót

Tehát az első dolog, amit meg kell tölteni egy játékos Flowplayer. Ehhez menj a hivatalos honlapján flowplayer.org:

Telepítése és konfigurálása Flowplayer lejátszó

Ezután menj a link Letöltés:

Telepítése és konfigurálása Flowplayer lejátszó

És mi kattintson Download Zip - azaz, töltse le a zip fájlt, a forráskód a játékos. A mai lecke, fogjuk használni egy tesztoldal, hogy jött létre a segítségével HTML5. Mivel ezt a leckét fogjuk vizsgálni a telepítését és konfigurálását a játékos kapcsolatban HTML5. Következő csomagolja ki a beérkezett archívumban. Ennek eredményeként a kicsomagolás megkapjuk a következő sor pányvák:

scin - csomag tartalmazza a CSS fájlok, amelyek felelősek a megjelenése a játékos. A mappa tartalmát másolni a css mappába, amely tartalmazza az összes fájlt css, honlapunkon;

flowplayer.js - file felelős a teljesítménye a játékos. Másolás mappába js;

flowplayer.min.js - file felelős a teljesítménye a játékos - egy teljes másolatát predyduschenigo. Ezt a tömörített másolatot flowplayer.js fájlt. Másolás mappába js;

flowplayer.swf - flash player. Az egyszerűség kedvéért másoljuk a gyökere oldalunkat;

index.html - demo fájlt, amely lehetővé teszi, hogy értékelje a játékos Flowplayer ezt nem kell fájlba;

LECENSE.md - Licenc információ. Jelenleg nem kell iktatnia;

Telepítése és konfigurálása Flowplayer lejátszó

Ezután kattintson a linkre letöltése jQuery és eljutni a lapon válassza ki a verziót letölteni. A választás a legfrissebb verziót, és töltse le a könyvtárban. Az eredményül kapott fájl is tárolja a js mappát. Ezután meg kell csatlakoztatni a fájlokat. Ehhez menj a index.html fájlt, és csatlakoztassa a szükséges alkatrészek (vagy bármilyen más fájlt, amely megjeleníti egy oldalon, meg kell jelennie a játékos):

Miután csatlakozik, a szükséges fájlokat, szükséges, hogy a játékos a képernyő, akkor létre kell hozni egy egység kerül a játékos. Ezért az a hely, az oldal, ahol meg szeretné jeleníteni a játékos, adjuk hozzá a következő kódot:

Telepítése és konfigurálása Flowplayer lejátszó






Azaz, a jQuery könyvtár, válasszon ki egy blokkot egy klasszis játékos (a blokk, amelyben a játékos meg kell jeleníteni). Ezután hívja a módszer Flowplayer vezeti majd a játékos a képernyőn. Ez a módszer küldi az objektumot a beállításokkal, az alábbiak szerint:

A lejátszási lista létrehozása

Ezután hozzon létre egy blokkot div, ahol a lejátszási lista lesz található, nevezetesen a hivatkozással a következő lejátszási lista elemei. Az osztály neve mondatba kell fp-lejátszási lista, ismét megfelelő működéséhez a lejátszási listát. Most megnézheted a lejátszó és a lejátszási lista, de be kell állítani a kijelző linkek, playlist kezelése.

Mivel minden kapcsolatot kezelő listákat - ezek közönséges tartalmazó div tudjuk majd rendezni őket megfelelően, a CSS szokásos szabályok ténylegesen mi (és ez egy nagyon fontos előnye Flowplayer játékos):

A lejátszási lista minden link, akkor nem fog a CSS hozzá hátteret semmilyen képet a lecke, hogy én, mint te is jól tudja csinálni maguknak. Most nézzük meg a változásokat a játékos:

Telepítése és konfigurálása Flowplayer lejátszó

kijelző feliratok

Flowplayer - támogatja kijelző felirat a képernyőn. Hadd emlékeztessem önöket, hogy feliratok - szöveges karakterláncokat megjelenő, általában az alsó-középső részét a játékos. Feliratok megjelenítésére, hozzá kell adnia az alábbi kódot (címkék között video).

Tag pályán - meg kell adni az attribútum src, az utat, hogy a különleges felhúzó felirattal. Ez a fájl írja, hogy mikor és milyen sorban kell megjeleníteni. Most nézzük meg a fájl formátumát (a fájlba mentett egy irattartó):

Mint látható, az elején meg kell adnia a fájl nevét, majd adja meg az időintervallumot, amikor egy bizonyos felirat meg kell jeleníteni. Most lássuk, mi van:

Telepítése és konfigurálása Flowplayer lejátszó

Mint látható, minden sikeresen működik. Most beszéljünk arról, hogyan kell beállítani a játékos, hogy megfeleljen az Ön igényeinek.

Customize játékos

Beállítás Flowplayer játékos végezzük főként továbbá bizonyos CSS osztályok a blokk, amelyben a játékos jelenik meg. Azaz a blokk az osztály Flowplayer. Először is, hadd határozza meg, hogyan kell beállítani a méretét megjelenik a képernyőn a játékos. Erre a célra elegendő, hogy jelezze a szélesség és a magasság, a CSS szabályok blokkolni egy osztály Flowplayer:

És akkor is hozzá egy képet, mint a háttér-lejátszó, amely előtt lesz látható a videó lejátszás, és a különböző szabályok elhelyezése a játékos a képernyő közepén. Ahhoz, hogy adja meg a képarányt, akkor kell hozzá adat arány attribútumot a blokk az osztály Flowplayer. Az attribútum értékét meghatározza a képarányt a játékos. Például: A méretaránya 3/4

Oldalarány 9/16

Most szabni a játékos. Módosítani az alapértelmezett témát, csak akkor válasszon egyet a CSS fájlok, amit kapott, amikor kicsomagolás archívumba játékos. Ezután a következő standard osztályok, személyre szabhatja a megjelenése a játékos:

fix-ellenőrzés - Control Panel játékos, van egy fix helyzetben a képernyőn;

félre időben - időben adott ki a vezérlőpulton található és a bal felső sarokban;

nem-háttér - off háttérrel a vezérlőpulton;

no-mute -, hogy elrejtse a hangerőszabályzó panel;

nem időben -, hogy elrejtse kijelző az idővonal;

no-térfogat -, hogy elrejtse a Hangerıszabályozót

play-gombot - a kijelzőn PLAY / STOP gombot.

Nézzük módosítsa a beállításokat a mi játékos:

És hozzá az átláthatóság, a központ a játékos, ez lesz hozzá a következő stílusok a style.css fájlban:

Telepítése és konfigurálása Flowplayer lejátszó

jelentése teljesképernyős - teljes képernyős módban, amikor e lejátszás;

van-help - amikor segítségre van megjelenítve;

van némítva - ha a játékos el van némítva

jelentése szüneteltetett -Ha szüneteltetheti a lejátszást mód;

van-játék - ha játszik autó;

van kész - ha a játékos teljesen betöltött;

Például, ha a stílusok hozzá a következő kódot:

A képernyőn látjuk a következő:

Telepítése és konfigurálása Flowplayer lejátszó

Minden jót, sikeres kódolás! És találkozunk a következő órákat!

A legtöbb IT hírek és webfejlesztés A csatorna-távirat







Kapcsolódó cikkek