Voit upottaa elokuvan HTML-dokumenttiin alla olevien esimerkkien avulla. Yhteensopivuuden vuoksi suosittelemme käyttämään MP4-videomuotoa, jota kaikki yleisimmät selaimet ja käyttöjärjestelmät tukevat.
Elokuvien isännöinti palvelimella voi olla kallista kaistanleveyskustannusten vuoksi. Vaihtoehtona on isännöidä video YouTubessa ja upottaa YouTube-videolinkki verkkosivullesi.
Kaikki alla olevat ehdotukset eivät toimi kaikilla selaimilla. Varmista, että käyttämäsi ratkaisu toimii niiden selaimien kanssa, joita haluat tukea.
Linkki elokuvatiedostoihin
Alla olevissa esimerkeissä on erilaisia tapoja saada videotiedosto katsottavaksi selainikkunassa. Suosittelemme myös luomaan tiedostoon suoran latauslinkin, jonka avulla vierailijat voivat ladata tiedoston, jos elokuvaa ei toisteta selaimessa. Alla on kaksi esimerkkiä suorista linkeistä kahdelle tämän sivun videotiedostolle.
Levykeasemarobotti
HTML-koodi
<a href="https://www.computerhope.com/issues/floppy2.avi">Floppy drive robot</a>
IBM Linux -mainos
HTML-koodi
<a href="https://www.computerhope.com/issues/ibm-linux.mov">IBM Linux commercial</a>
Upota YouTube-video
Videoiden isännöinti YouTubessa on hienoa, koska se säästää kaistanleveyskustannuksissa, voi tukea monia katsojia ja esittelee videosi useimpien Internet-sivustojen vierailijoille. Alla on esimerkki videosta, jota isännöidään YouTubessa ja joka on upotettu tälle sivustolle.
HTML-koodi
Kaikkien YouTube-videoiden HTML-koodi löytyy jokaisen YouTube-videon jakolinkin kautta. Kun olet napsauttanut Jaa-linkkiä, napsauta Upota-linkkiä. Alla on esimerkki koodista, jota käytetään yllä olevan YouTube-videon näyttämiseen.
<object height="350" width="425">
<param name="movie" value="https://www.youtube.com/v/R3ymHMgFAps">
<param name="wmode" value="transparent">
<embed height="350" src="https://www.youtube.com/v/R3ymHMgFAps?rel=0" type="application/x-shockwave-flash" width="425" wmode="transparent"> </object>
Videotunniste
HTML-koodi
<video controls>Your browser does not support the <video> tag.
<source src="/jargon/m/computer-hope.mp4"/>
</video>
Perus upotustunniste
Alla on koodi yksinkertaisimmasta menetelmästä tiedoston upottamiseksi verkkosivulle.
Esimerkki HTML-koodista
<embed src="https://www.computerhope.com/issues/floppy2.avi"></embed>
Tässä esimerkissä käytät upotuselementtiä osoittamaan sen elokuvatiedoston lähdettä, jonka haluat toistaa. Tämä esimerkki on hyvin yksinkertainen esimerkki, eikä se näytä varoituksia. Se ei osoita käyttäjää paikkaan, jossa hän voi ladata laajennuksen, jos videotiedostoa ei tueta.
Lisää elokuvatiedosto img-tunnisteen avulla
Jos et halua käyttää
Esimerkki HTML-koodista
<img dynsrc="https://www.computerhope.com/issues/floppy2.avi" start="fileopen">
Upota tagi toistaaksesi QuickTime-elokuvia (.MOV)
Apple QuickTime -elokuvatiedostot ovat toinen suosittu elokuvatyyppi Internetissä. Alla on perusesimerkki näiden tiedostojen sisällyttämisestä verkkosivullesi.
QuickTimea ei enää tueta Microsoft Windowsissa, eivätkä kaikki uudet selaimet enää tue tätä QuickTime-elokuvien upotusmenetelmää.
Esimerkki HTML-koodista
<embed src="https://www.computerhope.com/issues/ibm-linux.mov" Pluginspage="https://support.apple.com/quicktime" width="320" height="250" CONTROLLER="true" LOOP="false" AUTOPLAY="false" name="IBM Video"></embed>
Upotusesimerkissä koodin ensimmäinen osa osoittaa elokuvatiedoston src:hen (lähde), joka on itse elokuvatiedosto. Seuraavaksi laajennussivu on laajennuksen sijainti, jos vierailija ei ole asentanut sitä. Leveys ja korkeus ovat videotiedoston todellisia mittoja. Ohjaimen arvo voidaan asettaa arvoon tosi tai epätosi alasäätimien näyttämisen vaihtamiseksi.
Voit halutessasi lisätä videotiedoston korkeutta, jos et näe ohjainta.
Loop on asetus, jolla haluat tiedoston alkavan automaattisesti alusta, kun se on valmis. Lopuksi automaattinen toisto kertoo selaimelle, että se aloittaa tai ei aloita videotiedoston toistoa sivun latautumisen jälkeen.
Kirjoita upotustunnisteen attribuutti määrittääksesi laajennuksen
Sisällytä upotustunnisteeseen type-attribuutti määrittääksesi videotiedoston MIME-tyypin. Näin voit määrittää laajennuksen, joka tarvitaan videon toistamiseen selaimessa.
Esimerkki HTML-koodista
<embed src="https://www.computerhope.com/issues/floppy2.avi" type="video/x-msvideo"></embed>
Yllä olevassa esimerkissä type-attribuutiksi on asetettu video/x-msvideo, joka on AVI-videotiedostojen MIME-tyyppi.
Jos haluat määrittää muun tyyppisten videotiedostojen type-attribuutille määritettävän arvon, tarkista videotiedostojen MIME-tyyppien luettelo IANA Media Types -sivulta.
