|
|
|
|
|
Prikaz videa v stilu
V lekciji imate prikazano, kako lahko enostavno izboljšate izgled video posnetkov in flash datotek na svoji strani.
|
|
 |
|
|
|
|
|
 |
|
 |
|
 |
 |
1.
|
|
|
Kliknite tukaj, da si prenesete arhivirano mapo z datotekami, ki jih potrebujete.
|
|
| |
2.
|
|
|
Po prenosu si na svoj računalnik razširite mapo Video in jo odprite.
|
|
| |
3.
|
|
|
Nato datoteko Stran.html odprite v programu Adobe Dreamweaver.
|
|
| |
4.
|
|
|
Odprite pogled kode in se premaknite na konec vrstice z naslovom.
Nato kliknite Enter, da boste naredili prazno vrstico.
|
|
| |
5.
|
|
|
V prazno vrstico prilepite naslednjo kodo:
<link rel="stylesheet" href="videobox/css/videobox.css" type="text/css" media="screen" />
Ko prilepite kodo ponovno stisnite Enter, da naredite novo prazno vrstico.
|
|
| |
6.
|
|
|
Postavite se v vrstico in prilepite kodo:
<script type="text/javascript" src="videobox/js/mootools.js"></script> <script type="text/javascript" src="videobox/js/swfobject.js"></script> <script type="text/javascript" src="videobox/js/videobox.js"></script>
|
|
| |
7.
|
|
|
Pojdite v pogled Design in kliknite zgoraj na gumb za dodajanje slik.
Slika naj bo izrezek iz videa oz. naj ima neko povezavo z njim.
|
|
| |
8.
|
|
|
Slika je dodana.
Jaz sem dodal sliko iz videospota Iyaz- Replay.
|
|
| |
9.
|
|
|
Označite sliko in ji spodaj dodajte povezavo do video posnetka.
Od 14. koraka naprej je opisano dodajanje pravilne povezave.
|
|
| |
10.
|
|
|
Slika naj ostane označena.
Kliknite zgoraj na Code in videli boste, kje se nahajata slika in povezava.
|
|
| |
11.
|
|
|
Med " in > vstavite naslednjo kodo (glej sliko):
rel="vidbox 800 600" title="Naslov"
800- širina predvajalnika 600- višina predvajalnika Naslov- naslov posnetka, ki se pokaže pod predvajalnikom
|
|
| |
12.
|
|
|
Podatke s pomočjo prejšnjega koraka uredite, kakor vam ustreza.
Jaz sem nekoliko zmanjšal velikost predvajlnika in dodal izvajalca ter naslov pesmi.
|
|
| |
13.
|
|
|
Stran shranite in jo preverite delovanje prikaza.
V primeru nedelovanja se lahko posvetujete na forumu.
|
|
| |
14.
|
|
|
V naslednjih korakih si bomo ogledali, kakšno povezavo morate vnesti pri 9. koraku, da se bo video oz. flash predvajal.
Pri strani Youtube ne boste imeli problemov.
Primer povezave: http://www.youtube.com/watch?v=dTsYXtKeMx0
Isto povezavo vnesite tudi v polje za povezavo.
|
|
| |
15.
|
|
|
Pri strani Metacafe je zadeva popolnoma ista kot pri strani Youtube.
Torej, samo kopirate povezavo in jo prilepite.
|
|
| |
16.
|
|
|
Kako pa lahko prikažemo v stilu video posnetke s Facebooka?
Pomembno je, da kopiramo ID video posnetka, ki se nahaja na koncu URL naslova.
Npr. 1123386760593
Povezavo, ki jo bom prilepil pri 9. koraku bo: http://www.facebook.com/v/1123386760593
|
|
| |
17.
|
|
|
Pri strani Mojvideo je zadeva zelo podobna Facebooku.
Ponovno poiščemo ID video posnetka, ki ga najdemo na koncu povezave.
Npr. f3afea1df66cda6d55f2
Povezava, ki jo prilepimo pri 9. koraku pa je: http://www.mojvideo.com/v/f3afea1df66cda6d55f2
|
|
| |
18.
|
|
|
Bistvo prejšnjih dveh korakov pa je bilo, da smo prilepili direktno povezavo do predvajalnika.
Povezava do flash datoteke: http://www.zmaga.com/primer.swf
Tukaj pa ni problema. Prilepite neposredno povezavo do flash datoteke.
|
|
|
 |
 |
|
|
 |
|
|
 |
|
 |
 |
 |
| |
|
Menjavanje slik s povezavami
Osnove | 4. julij 2010 |
Avtor:
Dixo
Izdelali bomo spletno stran, na kateri bomo vstavili Javascript kodo, s pomočjo katere se bodo na spletni strani prikazovale vaše slike s povezavo do spletnih strani. |
|
|
|
| |
|
|
|
|
 |
|
 |
Kot kaže si se srečal s problemom prekrivanja javascript framework knjižnic.
V splošnem obstaja več javascript knjižnic, ki so namenjene isti stvari.
Med bolj znanimi sta tudi Prototype, ki jo uporabljaš v prvem primeru, ter mootools, ki ga uporabljaš v drugem primeru. Drugače pa je trenutno najbolj uporabljana podobna knjižnjica JQuery.
Ker te knjižnjice uporabljajo isto sintakso za naslavljanje spremenljivk, med seboj privzeto niso kompatibilne.
Sedaj imaš več možnosti:
1. Prirediš kodo.
Zadnja verzija mootols vsebuje kodo za izogibanje konfliktov. Na žalost je prototype ne, zato boš moral narediti popravke v knjižnjici za efekte, kar zna biti problematično.
http://efreedom.com/Question/1-1722791/P....
2. Najdeš efekt za video, ki prav tako uporablja knjižnico Prototype.
3. Za oboje najdeš podoben efekt, ki isto stvar dela z jQuery. Izbire imaš kar precej. Poglej recimo stran:
http://line25.com/articles/rounding-up-t....
|
 |
|
|
|
|
|
 |
|
 |
Podtalje to je use skupaj nekako nerazumljivo zame hehe .. še nisem takšen strokovnjak
Realife: To kodo sem vnesel, namesto kode za prikaz slik, pa vseeno ne gre. Bi morala delovati zagotovo? Sem pa sedaj, brez javascript kode dodal video, ki mi ga pa pač celozaslonsko predvaja, kar mi pa niti malo ni všeč, in ali je možnost da ta video spravim na velikost recimo 600×450? |
 |
|
|
|
|
|
 |
|
 |
Koda od realife-a sem skoraj prepričan, da ne bo delovala, zaradi problema kompatibilnosti javascript knjižnjic, ki sem ga opisal v moji prejšnji objavi.
Komaptibilnost bi lahko dosegel s spremembo kode, vendar pa je tehnično to že kar precej zahtevno.
Na tvojem mestu bi posksuil z uporabo jQuery knjižnice ter Shadowbox:
http://www.shadowbox-js.com/
Ta zna predvajati tako slike, kot tudi video, tako da uporabiš samo eno knjižnjico.
Kako uporabiš Shadowbox, lahko najdeš na:
http://www.shadowbox-js.com/usage.html
|
 |
|
|
|
|
|
 |
|
 |
Pozdravljeni!
Link za prenos pri prvi sliki ne deluje, ali pa ni pravilen....?
|
 |
|
|
|
|
|
 |
|
 |
Toomy:
Pozdravljeni!
Link za prenos pri prvi sliki ne deluje, ali pa ni pravilen....?
Sem popravil. Datoteka je bila že izbrisana. |
 |
|
|
|