Paano Gumawa ng isang HTML5 Slideshow

HTML5, pati na ang susunod na henerasyon ng web standard, ay sa paligid ng sulok. Gusto mo magdagdag ng suporta sa HTML5 sa iyong website? Siguro ay oras na hindi bababa sa upang maghanda. Ang artikulong ito ay magpapakita sa iyo ng 2 mga paraan upang gumawa ng HTML5 slideshow at i-embed sa iyong website.

Self-tumatakbo HTML5 Slideshow

Isa sa mga pinakamalaking pag-upgrade ng HTML5 ay na maaari mong direktang i-embed at i-play ng mga video online sa pamamagitan ng paggamit. Sa ganitong paraan, maaaring panoorin ang mga bisita ang slideshow HTML5 hangga't sinusuportahan ng kanilang browser HTML5. Walang kinakailangang Flash player. Dahil hindi dumating ang HTML5 sa kanyang huling bersyon, video codec ay maaaring gumamit WebM, H264, ogv o pareho.

Narito kung paano mo maaaring i-embed ng isang slideshow video HTML5:

<video poster = "movie.jpg" kontrol> 
    <pinagmulan src = 'movie.webm' type = 'video / webm; codec = "vp8.0, vorbis" '/> 
    <pinagmulan src =' movie.ogv 'type =' video / ogg; codec = "Theora, vorbis" '/> 
    <pinagmulan src =' movie.mp4 'type =' video / mp4; codec = "avc1.4D401E, mp4a.40.2" '/>
</ video>

Kung makikita mo ang video sa ibaba, ang iyong web browser ay sumusuporta sa HTML5, masyadong. Sa panahong ito, karamihan sa mga browser ay sumusuporta HTML5 slideshow na. Tingnan ang higit pang mga detalye tungkol sa mga browser HTML5.

Nilikha slideshow video HTML5 na may DVD Slideshow Builder Deluxe - Higit sa 100 mga transition.

Ngayon ano ang kailangan mo ay lamang ng isang HTML5 slideshow software at lumikha ng slideshow video sa MP4 (AVC) format.

Interactive HTML5 Slideshow

Tulad ng kasalukuyang ginagamit Flash slideshow sa mga website, maaari ka ring disenyo ng isang slideshow HTML5 walang i-install ng kahit ano. Siyempre, hindi mo na kailangang magsulat ng codec sa iyong sarili. Narito kami malawak na ibinahagi slideshow HTML5 online halimbawa upang ipakita sa iyo kung paano mag-embed ng isang slideshow ng HTML5.

1. Ilagay ang mga file sa tamang lugar.

Kapag nai-download mo ang proyekto file HTML5 mula dito, unzip ang file sa iyong computer, at ilipat o i-upload sa folder ng iyong website.

Mayroon ding mga iba pang mga tao na ibahagi ang kanilang mga proyekto HTML5 slideshow online. Google para sa isa at baguhin upang maging angkop sa iyong mga pangangailangan. Ito ay mas mahusay na ilagay ang copyright notice sa salamat trabaho ng iba, o sundin ang mga pahayag ng lisensya.

2. Baguhin ang code upang maging angkop sa iyong mga pangangailangan

Karaniwan, hindi mo na kailangan upang baguhin ang code ng css at js file, maliban sa address ng link kung kayo ay ilagay ang mga ito sa ibang folder. Halimbawa, dapat mong baguhin ang address ng link css file sa 'script / script.js' kung ikaw ay lumipat script.js file sa isang umiiral na folder na tinatawag na 'script'. Ang ganitong uri ng address link ay tinatawag na mga kamag-anak na link, habang ang isa pang uri ay ang absolute link, tulad ng mga http://yoursite.com/scripts/script.js. Kung ang slideshow HTML5 ay i-embed sa isang pahina sa isang folder, dapat mong gamitin ang isang bagay tulad ng '../scripts/script.js'. Gusto mong mas mahusay na gamitin ang absolute link kung hindi ka pamilyar sa mga pagkakaiba.

Ang pinaka-mahalagang bahagi ng HTML5 slideshow ay minarkahan sa red box. Kopyahin ang mga code na ito sa anumang pahina na nais mong HTML5 slideshow upang ipakita at baguhin ang address ng imahe tulad ng inilarawan sa itaas.

I-click upang palakihin.

3. I-preview sa mga browser HTML5

Panghuli, tingnan kung paano ang hitsura ng slideshow HTML5 tulad ng sa iyong browser HTML5. Karaniwan, ikaw ay makakakuha ng  ito HTML5 slideshow.  Sa pahina, maaari mo ring i-download ang mga file HTML5 slideshow at makita ang mga detalyadong proseso sa disenyo ito sa pamamagitan ng Martin Angelov.

Suriin din ang mga template slideshow Flash upang gumawa ng slideshow ng website sa mga pag-click.