Multiple HTML5 Videos on one page

How can I get more than one HTML5 video on one page?  When I tried to place 4 3-sec videos with autoplay and looping, only the first one plays.
  <video height="300" weight="300" controls preload="none" autoplay loop>
<source src="video1.m4v" type= "video/mp4"/>
  <video height="300" weight="300" controls preload="none" autoplay loop>
<source src="video2.m4v" type= "video/mp4"/>
  <video height="300" weight="300" controls preload="none" autoplay loop>
<source src="video3.m4v" type= "video/mp4"/>
  <video height="300" weight="300" controls preload="none" autoplay loop>
<source src="video4.m4v" type= "video/mp4"/>
Thank you

Hi
Unfortunately you cannot, as most browsers use an "exclusive OR" code for playing videos, which means that only one will play at a time. The reason for this is that if they did not do so you could have multiple soundtracks playing at the same time.
There are 3rd party players that will do this though, (sorry cannot recommend any specific player, but try a search).
PZ

Similar Messages

  • Multiple HTML5 Content on One Page Issue...

    I have created a couple really basic animated graphs for a DPS article in Adobe Edge Animate but am having issues with them once they are previewed or pushed to the cloud.  Both graphs are created and published exactly the same way from Edge and placed in the InDesign document the exact same way.  Both are published with web settings and the frame that I am creating is set as a web object and pointed towards the appropriate folder and .html file.
    If either is added and previewed individually, both work just fine.  However, if both are placed on the same page, only one will work properly.  To more specific, both will load their backgrounds but neither only ones animated feature (a line graph and a bar graph) will work.  It varies which one will load and work properly so trouble shooting has been difficult.
    Has anyone run into this issue and/or no a way to solve it?
    Thanks.

    That is what I was doing.  Both frames are set as web content overlays and link back to their separate folders & respective index.html files. 
    If I turn off auto play I can tap on both and get them to work individually.  i.e. if I tap graph 1, it works but then tapping graph 2 does nothing.  If I reload the page and try the opposite, graph 2 tapped first, it loads but now graph 1 does not.
    I attempted to load them as .oam packages however I can't place them in InDesign 5.5.  Is there a known issue with that as well?
    Thanks again.

  • How to embed multiples HTML5 videos onto simple web page?

    How to insert multiples HTML5 videos onto single web page?

    I recommend Pickle Player -- one player can support playlists of MP4 or M4V video files.
    http://www.pickleplayer.com/
    Nancy O.

  • I need an idea how to place multiple videos on one page

    Multiple videos on one page in Muse neded for a video portfolio..
    Anyone got a great idea how this can be done please. (or direct me to a tutorial link - doing one is all I can find)
    I am happy with either embedded or Menu linked on objects to videos.
    Youtube is hosting the videos
    I just cant find any way to put hyperlinks or urls in objects and I can not find a way to make small video players in Muse.
    If I scale the container ..things go very weird. eg the video goes tiny and into a corner.
    I feel like I am working with half a tool box!!!
    I cant even find a template where this has been done.
    Any help is appreciated. Thanx.

    That works perfectly thank you.
    Now I am wondering if I can have a single "viewer" that will play any selected video from a button , a menu or other trigger?
    Info for others if required. :  The You tube ID required in the widget setting is not the URL.  Its an alpha/numeric obtained from part of the YT embedding code.
    example - the bold underlined section
    <iframe width="720" height="405" src="//www.youtube.com/embed/w6ZcCOCihuY" frameborder="0" allowfullscreen></iframe>

  • Can i have multiple applications open on one page

    can i have multiple applications open on one page?

    JShimazaki wrote:
    Mac OS X Mountain Lion supports multitasking like cbs20 mentioned. Just like MS Windows just press alt+tab to switch to whatever applications you have open.
    Actually it isn't Alt-Tab on OS X, it's Command-Tab to use the Application Switcher.
    Also, Control+ left/right arrow key will switch spaces if that's what's desired.

  • How can I make multiple popup links on one page?

    I was wondering if anyone had a simple code that will allow me to have multiple popup links on one page? I have no idea what to do.  Any help would be greatly appreciated.

    Give each an individual id like:
    <SCRIPT language="JavaScript1.2">
    function openwindow1()
    window.open("score_popup/wbc_slalom_running_order.html",
    "mywindow","location=1,status=1,scrollbars=1,width=600,height=525");
    .......... etc.
    and then:
    <p><a href="javascript: openwindow1()">WBC Invitational Slalom Event Running Order</a></p>
    View actual working page here:
    http://www.worldbarefootcenter.com/
    scroll to bottom of page to see pop-up links. View source code for complete details:
    Best wishes,
    Adninjastrator

  • Multiple ALV reports on one page

    How to display multiple ALV reports on one page.

    this done by this code....
    *& Report  ZPR_02
    REPORT  ZPR_02.
    TYPE-POOLS: SLIS.
    Tables Declaration.
    TABLES: MARA.
    *Internal tables and data declaration.
    DATA: BEGIN OF IT_MARA OCCURS 0,
            MATNR LIKE MARA-MATNR,
            MTART LIKE MARA-MTART,
            MBRSH LIKE MARA-MBRSH,
          END OF IT_MARA,
          BEGIN OF IT_MARC OCCURS 0,
            MATNR LIKE MARC-MATNR,
            WERKS LIKE MARC-WERKS,
            EKGRP LIKE MARC-EKGRP,
          END OF IT_MARC,
          BEGIN OF IT_MARD OCCURS 0,
            MATNR LIKE MARD-MATNR,
            WERKS LIKE MARD-WERKS,
            LGORT LIKE MARD-LGORT,
            LABST LIKE MARD-LABST,
          END OF IT_MARD.
    DATA: WA_FIELD_CAT TYPE SLIS_FIELDCAT_ALV,
          IT_FIELD_CAT1 TYPE SLIS_T_FIELDCAT_ALV,
          IT_FIELD_CAT2 TYPE SLIS_T_FIELDCAT_ALV,
          IT_FIELD_CAT3 TYPE SLIS_T_FIELDCAT_ALV,
          WA_KEYINFO TYPE SLIS_KEYINFO_ALV,
          IT_LAYOUT TYPE SLIS_LAYOUT_ALV,
          IT_EVENTS1    TYPE SLIS_T_EVENT WITH HEADER LINE,
          IT_EVENTS2    TYPE SLIS_T_EVENT WITH HEADER LINE,
          IT_EVENTS3    TYPE SLIS_T_EVENT WITH HEADER LINE.
    *Selection Screen.
    SELECT-OPTIONS: S_MATNR FOR MARA-MATNR.
    *Start Of selection.
    START-OF-SELECTION.
    *Selecting the data.
      PERFORM SELECT_DATA.
    *Populating the field catelogue.
      PERFORM BUILD_FIELD_CAT.
    *Displaying the final output.
      PERFORM DISPLY_OUTPUT.
    *&      Form  Select_data
          Selecting the data.
    FORM SELECT_DATA .
      SELECT MATNR
             MTART
             MBRSH FROM MARA
           INTO TABLE IT_MARA
           WHERE MATNR IN S_MATNR.
      IF NOT IT_MARA[] IS INITIAL.
        SELECT MATNR
               WERKS
               EKGRP FROM MARC
             INTO TABLE IT_MARC
             FOR ALL ENTRIES IN IT_MARA
             WHERE MATNR EQ IT_MARA-MATNR.
      ENDIF.
      IF NOT IT_MARC[] IS INITIAL.
        SELECT MATNR
               WERKS
               LGORT
               LABST FROM MARD
             INTO TABLE IT_MARD
             FOR ALL ENTRIES IN IT_MARC
             WHERE MATNR = IT_MARC-MATNR
             AND   WERKS = IT_MARC-WERKS.
      ENDIF.
    ENDFORM.                    " Select_data
    *&      Form  Build_field_cat
         Populating the field catelogue.
    FORM BUILD_FIELD_CAT .
      DEFINE M_FIELDCAT1.
        WA_FIELD_CAT-TABNAME = &1.
        WA_FIELD_CAT-FIELDNAME = &2.
        WA_FIELD_CAT-SELTEXT_L = &3.
        APPEND WA_FIELD_CAT TO IT_FIELD_CAT1.
      END-OF-DEFINITION.
      DEFINE M_FIELDCAT2.
        WA_FIELD_CAT-TABNAME = &1.
        WA_FIELD_CAT-FIELDNAME = &2.
        WA_FIELD_CAT-SELTEXT_L = &3.
        APPEND WA_FIELD_CAT TO IT_FIELD_CAT2.
      END-OF-DEFINITION.
      DEFINE M_FIELDCAT3.
        WA_FIELD_CAT-TABNAME = &1.
        WA_FIELD_CAT-FIELDNAME = &2.
        WA_FIELD_CAT-SELTEXT_L = &3.
        APPEND WA_FIELD_CAT TO IT_FIELD_CAT3.
      END-OF-DEFINITION.
      M_FIELDCAT1 'MARA' 'MATNR' 'Material No'.
      M_FIELDCAT1 'MARA' 'MTART' 'Material type'.
      M_FIELDCAT1 'MARA' 'MBRSH' 'Industry Sector'.
      M_FIELDCAT2 'MARC' 'MATNR' 'Material No'.
      M_FIELDCAT2 'MARC' 'WERKS' 'Plant'.
      M_FIELDCAT2 'MARC' 'EKGRP' 'Purchasing Group'.
      M_FIELDCAT3 'MARD' 'MATNR' 'Material No'.
      M_FIELDCAT3 'MARD' 'WERKS' 'Plant'.
      M_FIELDCAT3 'MARD' 'LGORT' 'Storage Loc'.
      M_FIELDCAT3 'MARD' 'LABST' 'Valued Stock'.
      IT_EVENTS1-NAME  =  'TOP_OF_PAGE'.
      IT_EVENTS1-FORM  =  'F_TOP_OF_PAGE_ONE'.
      APPEND IT_EVENTS1.
      CLEAR IT_EVENTS1.
      IT_EVENTS2-NAME  =  'TOP_OF_PAGE'.
      IT_EVENTS2-FORM  =  'F_TOP_OF_PAGE_TWO'.
      APPEND IT_EVENTS2.
      CLEAR IT_EVENTS2.
      IT_EVENTS3-NAME  =  'TOP_OF_PAGE'.
      IT_EVENTS3-FORM  =  'F_TOP_OF_PAGE_THREE'.
      APPEND IT_EVENTS3.
      CLEAR IT_EVENTS3.
    ENDFORM.                    " Build_field_cat
    *&      Form  disply_output
         Displaying the final output.
    FORM DISPLY_OUTPUT .
      CALL FUNCTION 'REUSE_ALV_BLOCK_LIST_INIT'
        EXPORTING
          I_CALLBACK_PROGRAM = SY-REPID.
      CALL FUNCTION 'REUSE_ALV_BLOCK_LIST_APPEND'
        EXPORTING
          IS_LAYOUT                        = IT_LAYOUT
          IT_FIELDCAT                      = IT_FIELD_CAT1[]
          I_TABNAME                        = 'IT_MARA'
          IT_EVENTS                        = IT_EVENTS1[]
      IT_SORT                          = IT_SORT
      I_TEXT                           = ' '
        TABLES
          T_OUTTAB                         = IT_MARA     .
      CALL FUNCTION 'REUSE_ALV_BLOCK_LIST_APPEND'
        EXPORTING
          IS_LAYOUT                        = IT_LAYOUT
          IT_FIELDCAT                      = IT_FIELD_CAT2[]
          I_TABNAME                        = 'IT_MARC'
          IT_EVENTS                        = IT_EVENTS2[]
      IT_SORT                          = IT_SORT
      I_TEXT                           = ' '
        TABLES
          T_OUTTAB                         = IT_MARC    .
      CALL FUNCTION 'REUSE_ALV_BLOCK_LIST_APPEND'
        EXPORTING
          IS_LAYOUT                        = IT_LAYOUT
          IT_FIELDCAT                      = IT_FIELD_CAT3[]
          I_TABNAME                        = 'IT_MARD'
          IT_EVENTS                        = IT_EVENTS3[]
      IT_SORT                          = IT_SORT
      I_TEXT                           = ' '
        TABLES
          T_OUTTAB                         = IT_MARD    .
      CALL FUNCTION 'REUSE_ALV_BLOCK_LIST_DISPLAY'
    EXPORTING
      I_INTERFACE_CHECK             = ' '
      IS_PRINT                      = IS_PRINT
      I_SCREEN_START_COLUMN         = 0
      I_SCREEN_START_LINE           = 0
      I_SCREEN_END_COLUMN           = 0
      I_SCREEN_END_LINE             = 0
    IMPORTING
      E_EXIT_CAUSED_BY_CALLER       = E_EXIT_CAUSED_BY_CALLER
      ES_EXIT_CAUSED_BY_USER        = ES_EXIT_CAUSED_BY_USER
    EXCEPTIONS
      PROGRAM_ERROR                 = 1
      OTHERS                        = 2
      IF SY-SUBRC <> 0.
    MESSAGE ID SY-MSGID TYPE SY-MSGTY NUMBER SY-MSGNO
            WITH SY-MSGV1 SY-MSGV2 SY-MSGV3 SY-MSGV4.
      ENDIF.
    ENDFORM.                    " disply_output
    *&      Form  top_of_page_one
          text
    FORM F_TOP_OF_PAGE_ONE.
      WRITE: / 'Header details (MARA)'.
    ENDFORM.                    "top_of_page_one
    *&      Form  top_of_page_one
          text
    FORM F_TOP_OF_PAGE_TWO.
      WRITE: / 'Item details (MARC)'.
    ENDFORM.                    "top_of_page_one
    *&      Form  top_of_page_one
          text
    FORM F_TOP_OF_PAGE_THREE.
      WRITE: / 'Item details (MARD)'.
    ENDFORM.                    "top_of_page_one
    regards,
    venkat.

  • Multiple videos on one page

    so i have created a website (which i haven't posted yet) in iweb- my question concerns video on iweb. on one page i have 5 videos that range from 20MB to 60MB, i would like these videos to download without a lot of wait time. curious what the wait time for this page would be? and also, would it be better to create a picture and then a hyperlink to each video? would that be faster? would preferably like to have multiple videos play on the page rather than hyperlinking to another page, but from what i've read, it sounds like it takes a while to download a page like that. also, i am not going to use mobileme, most likely godaddy.
    thank you.
    ben

    I just learned from toad yesterday...and I was where you were. I was afraid to try the code thing. But I kept pushing till I figured it out.
    I also publish with GoDaddy. They are very Mac friendly.
    My suggestion is that you upload your video file to Godaddy first. I used Cyberduck (free). When you get Cyberduck up and your file uploaded to the server, look (navigate) on the Cyberduck interface to the video file you have created the button for.
    Then, go to "Get Info" in the pulldown menu. You will see the URL that GoDaddy has assigned to the video (basically the Directory/Path).
    This is the info you want to put in the code part on iWeb where (in red) you replace the template text.
    To help you understand what Toad has published in red:
    1. the first red is where the URL path from the Cyberduck info goes.
    2. the second reds are the size of the Video you want to display. I find that 640x480 works very well.
    3. the last red is what your button will say: replace with "Click to Play"
    BIG HINT: Get Quicktime Pro. That interface will allow you to save your vide as a "Fast Start" video for uploading. I think this is Apple's equivalent of Flash.
    Once you get your stuff in place you will probably have to have a few phone sessions with Tech support at GDaddy. They can spot your mistakes and help get you up.
    Good Luck. This was all new to me and very intimidating - but 48 hours later I was able to have it all working.
    I even got it working on Network Solutions - but it was much more of a headache.
    For large video files, though, NetSol will let you put your videos on a Streaming Server for faster and more reliable service. Problem is that server only works with RealMedia and Windows Media Player...and who wants to convert all their QT files.

  • Multiple videos on one page - need to keep all visible once played

    Hello all,
    Firstly, I'll admit that I'm a novice as far as DPS goes...the app I'm working on is only my second attempt. I've managed to put the bones of it together, but I'm having problems with some video files.
    I only realised today that you can't use InDesign's animation facility as it uses Flash (this app's for the iPad).
    This is what I need to achieve: on one page, there are numbers 1, 2 and 3, running vertically. These are buttons. When each button is pressed, I want a line of text to fade in next to it.
    I couldn't get this to work with an image sequence so I've created three movies. I dropped the first one in and it faded in fine when button one was pressed.
    The problem is - when I press button 2, the text (movie) next to button one disappears. Is there any way to keep all three movies showing their last frame at once?
    Sorry this is a bit long-winded....hope you can help people!
    Cheers,
    Anth.

    I would rather use MSOs to get the effect you describe.
    For each button a 2-state MSO would do the job perfectly.

  • Won't play multiple videos on one page.  Ignores POSTER FRAME.

    Three questions really. I have iweb '09, the latest everything, blah blah....
    1) I just update my iweb page and it's now showing my URL twice, in the URL--any thoughts.
    2) Also, I have three quick-time movies on one page and only the top will play. Why don't the other two play?
    3) I've taken "auto play" off and the poster frame I set won't work either. Anyone know why it's ignoring poster frames I set?

    Two of your files are .mpg (MPEG-1) and the other is a .mov file but does not display in my browser.
    No poster frames for MPEG-1 formats.
    http://www.pulseproductions.org/pulseproductions.org/Media/Dance-H.264%20800Kbps .mov is the location of that file but it doesn't work from your server unless manually linked (like I did above).
    Your server doesn't like "spaces" in your file names. Try renaming your files to remove them.

  • Firefox is hanging when the page scrolls down to a html5 video or the page to a slideshow with fade effect

    Every time a page has a html5 video or a slideshow with fade effect Firefox 3.6 becomes terriblely slow. It freezes with this test: http://demos.hacks.mozilla.org/openweb/HWACCEL/
    I have Fedora 14 and before that Fedora 13 and the problem happens with both.
    The same doesn't happen on Opera or Google Chrome.
    '''UPDATE 1''': I have already tryed the Safe Mode and the problem happens the same.
    '''UPDATE 2:''' This page full of videos scroll smothly without any problemas: http://brettgaylor.tumblr.com/tagged/webmademovies

    I forgot to say that I did tryed the Safe Mode just to see if the slow was not being caused by some extension or plugin. However the result was all the same. By the way, the slow happens even if there is only one page opened. I am not thinking it is something related to the ATI video card or even Fedora because the same slow does't happen in Chrome and Opera...

  • How do I print multiple (4) photos on one page with a border around each?

    How do I print multiple photos on one page with a border around each? I've gone the contact sheet route and adjusted the number of columns but there's only outer margins and very little white space between the photos down the middle of the page.

    Ok, now I feel stupid! I always thought I was printing 6 x 4 but now I realise I can't have done!!
    The photos that I used to print are approx. 5.2" x 4" (i.e. 4 fitted nicely on a page & I had to cut the boarder off).
    I guess I just need to play with different sizes under the 'custom' option in order to get the biggest possible picture!
    Thanks for the help

  • Multiple Flash Videos on 1 Page

    Hi All
    If i were to put 4 flash videos into a page, by using the
    'import flash video' function in DW CS3 - will they all load at the
    same time, or only load when the user clicks play?
    Many Thanks
    JP

    Im not sure I understand, however I have a page up with 2
    flash movies, but
    I timed them by extending the first frame on the one to not
    start any motion
    until the first one is coming to an end.
    So they both in essence start at once, but the one on top
    plays out, as it
    is coming to an end, the one in the body begins to move...
    http://www.unitexservices.com
    Dont know if that helps you or not.
    Gary
    "thewakeplace.com" <[email protected]> wrote
    in message
    news:g45nrn$3ee$[email protected]..
    >I have a bank of videos that i want to put onto the site.
    >
    > Originally, i was going to do an XML list through a
    flash player. But i
    > don't
    > have the flash server, and i don't know enough of flash
    to do it another
    > way
    > (and i can't find a tutorial).
    >
    > So i have 20+ videos that are Quicktime and im HD, that
    i have converted
    > into
    > flash, as it adds a nice lat compression to make them
    smaller. From there
    > i
    > want to fit around 4 to 5 videos on a page one after
    each other (kind of
    > like
    > vimeo.com).
    >
    > So what i need to know is if i put 5 videos on a page,
    when the user goes
    > onto
    > that page, will they all start to play and will the page
    start to stream 5
    > vids
    > at once.
    > OR - will they only stream WHEN the user clicks the play
    button on each
    > one?
    >
    > Does that make more sense?
    >
    >
    >

  • View multiple pdf files in one page

    Hi experts!
    I have to build a mobile website that will show multiple pdf files (not just the links) on one page for comparison. I've found out that using iFrames or embedded object is not an option since scrolling is not available in either of them. What do you suggest I use for this purpose?
    Any help is appreciated.
    Thanks in advance.

    The application Preview.
    Preview Help.
    Save combined PDFs
    Open the PDFs you want to combine.
    In each open PDF, choose View > Thumbnails to display the pages of the PDF in the sidebar.
    Drag the thumbnails you want to add (Command-click to select noncontiguous pages) to the thumbnail sidebar in the other PDF.You can add pages to the end of the document or between pages in a document. Drag thumbnails to reorder them. You can also add a PDF file before or after another PDF document.
    Choose File > Export to save a new PDF containing all of the combined pages, or choose File > Save to replace the original version of the destination PDF with the version containing the combined pages.

  • How to use HTML5 Video in adf page

    Hi,
    I need to use HTML5 video instead of af:media in my adf page inorder to avoid browser plugin request to the end user.
    I've placed the video tag in .jsff as below:
    <video width="320" height="240" controls="controls" poster="../resource/poster.png">
    <source src="../resource/FAE_Intro_cropped.mp4" type="video/mp4" />
    <source src="../resource/FAE_Intro.ogg" type="video/ogg" />
    Your browser does not support the video tag.
    </video>
    When I run the web application, it shows the poster image but it does not show the video. It simply shows a 'X' in the center.
    I'm using jdev version:
    Studio Edition Version 11.1.1.3.0
    Build JDEVADF_11.1.1.3.PS2_GENERIC_100408.2356.5660
    Can someone please help me in this regard.
    Thanks,
    Bhaskar Podugu

    Yes. I tried surrounding with f:verbatim tag but still it did not worked.
    The actual HTML file when run outside of jdev (i.e., going to the folder and double clicking the .html file) is showing up the video but when the same is run through jdev as a deployment, it doesn't show up.
    I'm testing this in Mozilla FF 9.0.1.
    If the reference to the video file is incorrect, it shouldn't even show the poster image but I can see the poster image which is also placed in the same location.
    I tried placing af:inlineFrame(pointing it to the actual HTML file) inside jsff page, but it did not work.
    Does weblogic server need any configuration for flushing HTML5 Video content?

Maybe you are looking for