Come faccio a incorporare un film mp4 nel mio html?

StackOverflow https://stackoverflow.com/questions/2299347

  •  21-09-2019
  •  | 
  •  

Domanda

Ho una sezione blog sul mio sito che ha l'editor TinyMCE. Voglio incorporare un video quando ho posto un blog ed è solo sputare fuori il codice. Ho aggiunto il tag <embed> sul mio script di output.

Questo è il codice che sto usando per per il video: 

<object width="425" height="350">
    <param name="movie" value="http://www.youtube.com/v/CgW_5Vthsds"></param>
    <param name="wmode" value="transparent"></param>
    <embed src="http://www.youtube.com/v/" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed>
</object>

Che cosa mi manca?

È stato utile?

Soluzione

Si dovrebbe guardare in video per tutti :

  

Video per Tutti è molto semplicemente un pezzo di codice HTML che incorpora un video in un sito web   utilizzando l'elemento HTML5 che offre la riproduzione nativa in Firefox   3.5 e Safari 3 e 4 e un numero crescente di altri browser.

     

Il video viene riprodotto dal browser stesso. Si carica velocemente e non minaccia in crash il browser.

     

In altri browser che non supportano, spetta   torna a QuickTime.

     

Se QuickTime non è installato, Adobe Flash viene utilizzata. È possibile ospitare localmente o incorporare qualsiasi file Flash, come ad esempio un video di YouTube.

L'unico aspetto negativo, è che devi avere 2/3 versioni dello stesso video memorizzato, ma si può servire a tutti i dispositivi / navigatore esistente che supporta video (cioè .: l'iPhone). 

<video width="640" height="360" poster="__POSTER__.jpg" controls="controls">
    <source src="__VIDEO__.mp4" type="video/mp4" />
    <source src="__VIDEO__.webm" type="video/webm" />
    <source src="__VIDEO__.ogv" type="video/ogg" /><!--[if gt IE 6]>
    <object width="640" height="375" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"><!
    [endif]--><!--[if !IE]><!-->
    <object width="640" height="375" type="video/quicktime" data="__VIDEO__.mp4"><!--<![endif]-->
    <param name="src" value="__VIDEO__.mp4" />
    <param name="autoplay" value="false" />
    <param name="showlogo" value="false" />
    <object width="640" height="380" type="application/x-shockwave-flash"
        data="__FLASH__.swf?image=__POSTER__.jpg&amp;file=__VIDEO__.mp4">
        <param name="movie" value="__FLASH__.swf?image=__POSTER__.jpg&amp;file=__VIDEO__.mp4" />
        <img src="__POSTER__.jpg" width="640" height="360" />
        <p>
            <strong>No video playback capabilities detected.</strong>
            Why not try to download the file instead?<br />
            <a href="__VIDEO__.mp4">MPEG4 / H.264 “.mp4” (Windows / Mac)</a> |
            <a href="__VIDEO__.ogv">Ogg Theora &amp; Vorbis “.ogv” (Linux)</a>
        </p>
    </object><!--[if gt IE 6]><!-->
    </object><!--<![endif]-->
</video>

Non è una versione aggiornata che è un po 'più leggibile: 

<!-- "Video For Everybody" v0.4.1 by Kroc Camen of Camen Design <camendesign.com/code/video_for_everybody>
     =================================================================================================================== -->
<!-- first try HTML5 playback: if serving as XML, expand `controls` to `controls="controls"` and autoplay likewise       -->
<!-- warning: playback does not work on iPad/iPhone if you include the poster attribute! fixed in iOS4.0                 -->
<video width="640" height="360" controls preload="none">
    <!-- MP4 must be first for iPad! -->
    <source src="__VIDEO__.MP4" type="video/mp4" /><!-- WebKit video    -->
    <source src="__VIDEO__.webm" type="video/webm" /><!-- Chrome / Newest versions of Firefox and Opera -->
    <source src="__VIDEO__.OGV" type="video/ogg" /><!-- Firefox / Opera -->
    <!-- fallback to Flash: -->
    <object width="640" height="384" type="application/x-shockwave-flash" data="__FLASH__.SWF">
        <!-- Firefox uses the `data` attribute above, IE/Safari uses the param below -->
        <param name="movie" value="__FLASH__.SWF" />
        <param name="flashvars" value="image=__POSTER__.JPG&amp;file=__VIDEO__.MP4" />
        <!-- fallback image. note the title field below, put the title of the video there -->
        <img src="__VIDEO__.JPG" width="640" height="360" alt="__TITLE__"
             title="No video playback capabilities, please download the video below" />
    </object>
</video>
<!-- you *must* offer a download link as they may be able to play the file locally. customise this bit all you want -->
<p> <strong>Download Video:</strong>
    Closed Format:  <a href="__VIDEO__.MP4">"MP4"</a>
    Open Format:    <a href="__VIDEO__.OGV">"OGG"</a>
</p>

Altri suggerimenti

Se si dispone di un video mp4 residente a server e si desidera che i visitatori lo streaming che sopra la vostra pagina HTML. 

<video width="480" height="320" controls="controls">
<source src="http://serverIP_or_domain/location_of_video.mp4" type="video/mp4">
</video>

Molto probabilmente l'editor TinyMCE sta aggiungendo la propria formattazione al palo. Avrete bisogno di vedere come si può sfuggire le capacità di editing di TinyMCE. Il codice funziona bene per me. Si tratta di un blog wordpress?

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top