Html značka video je namenjena prikazovanju video vsebin na spletni strani. Na voljo imamo več različnih parametrov, ki vplivajo na samo delovanje video vsebin ter različne video formate.
HTML video značka je precej preprosta in podobna elementu za slike – picture element.
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Atribut »controls« doda opcijo kontroliranja video vsebin, »source« nudi podporo različnim formatom video vsebin, ker pomeni da je najbolje podpreti več različnih formatov. Nekoč je bil na voljo tudi »autoplay«, ki pa je sedaj v Chromium brskalnikih avtomatsko blokiran, razen če je »muted« (potiho), potem se vedno predvaja. Tako se lahko avtomatski blokadi izognemo z vklopljeno opcijo »muted«.
Kako ugasnemo prenos video vsebin oz. download
V osnovi je donwload pz. Prenos ne mogoče preprečiti, vedno obstajajo metode, kjer lahko z malo znanja praktično vse video vsebine prenesemo. Lahko pa slednje otežimo. Npr. spodnja koda preprečuje osnoven prenos video vsebin.
<video oncontextmenu="return false;" id="myVideo" autoplay controls loop muted controlsList="nodownload">
<source src="video-p.mp4" type="video/mp4">
</video>
<style>
video::-internal-media-controls-download-button {
display:none;
}
video::-webkit-media-controls {
overflow: hidden !important
}
video::-webkit-media-controls-enclosure {
width: calc(100% + 52px);
margin-left: auto;
}
</style>
To dosežemo z uporabo t.i. »controlsList« atributov. Dodatne informacije »Media updates in Chrome 58«. “oncontextmenu=”return false;” poskrbi, da ni desnega klika za prenos videa. Če ta ukaz ne prime, potem je potrebno to urediti ločeno s klicem “document.querySelector(‘video’).setAttribute(‘oncontextmenu’, “return false;”)”. V primerih, kjer ne deluje pa s pomočjo CSSja gumb premaknemo iz vidnega polja. Najbolje je uporabiti vse.
100% zaščite pred prenosi ni, vedno obstajajo načini kako slednje zaobiti oz. se tudi sami brskalniki spreminjajo, nadgrajujeo, … Html video značka je sicer dobro podprta in jo lahko uporabljate praktično povsod.
Pri implementaciji se vedno vprašajte kaj je najbolje za dan primer, uporabiti HTML video metodo, ali je bolje uporabiti YouTube ali Vimeo ali kakšno drugo storitev. Namreč večina platform za video naredi večino težkega dela, vse kar potrebujemo je video. Poleg tega dobimo dodaten kanal za širjenje našega sporočila.
Dodatne vsebine: