1. Forum
  2. Usenet
  3. COMP.INFOSYSTEMS.WWW.AUTH

  • video on iPhone

    From Dale@21:1/5 to All on Sun Aug 21 18:15:04 2022
    Hi,

    On my iPhone-6s my videos only show an arrow to start with.

    Pressing the arrow works fine.

    Just thinking this isn't obvious to the visitor.

    The videos can be found here ...

    https://www.dalekelly.org/weblog.html

    I have this in the head ...

    <head>

    (other stuff ...)

    <style>
    video {
    max-width: 100%;
    height: auto;
    }
    </style>

    </head>

    and here is an example video code ...


    <video controls>
    <source src="https://www.dalekelly.org/images/newwebcam.mp4" type="video/mp4">
    Your browser does not support the MP4 video tag.
    </video>



    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Arno Welzel@21:1/5 to All on Mon Aug 22 16:59:14 2022
    Dale, 2022-08-22 00:15:

    On my iPhone-6s my videos only show an arrow to start with.

    This is by design. Browsers do not allow autoplay videos if they are not
    muted. The only allowed way to let a video play is after a user interaction.

    [...]
    <video controls>
    <source src="https://www.dalekelly.org/images/newwebcam.mp4" type="video/mp4">
    Your browser does not support the MP4 video tag.
    </video>

    Try:

    <video controls muted autoplay>

    Or for Safari with additional "playsinline":

    <video controls muted autoplay playsinline>

    Just keep in mind - autoplay will not work, if the video is not muted initially.

    Also see:

    <https://pqina.nl/blog/fix-html-video-autoplay-not-working/>


    --
    Arno Welzel
    https://arnowelzel.de

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Arno Welzel on Mon Aug 22 13:26:09 2022
    On 8/22/2022 10:59 AM, Arno Welzel wrote:
    Dale, 2022-08-22 00:15:

    On my iPhone-6s my videos only show an arrow to start with.

    This is by design. Browsers do not allow autoplay videos if they are not muted. The only allowed way to let a video play is after a user interaction.


    Not looking for an autoplay. What's its value?

    there isn't an image to start with behind the arrow on the iPhone, using Chrome, just an arrow

    Chrome and Edge on Windows 10 have an image in its toolbar

    Amazon Silk on a Fire-TV has an image with a centered arrow, but no
    arrow in its toolbar




    [...]
    <video controls>
    <source src="https://www.dalekelly.org/images/newwebcam.mp4"
    type="video/mp4">
    Your browser does not support the MP4 video tag.
    </video>

    Try:

    <video controls muted autoplay>

    Or for Safari with additional "playsinline":

    <video controls muted autoplay playsinline>

    Just keep in mind - autoplay will not work, if the video is not muted initially.

    Also see:

    <https://pqina.nl/blog/fix-html-video-autoplay-not-working/>



    Thank You ! Will give this a try.


    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Arno Welzel@21:1/5 to All on Tue Aug 23 15:33:57 2022
    Dale, 2022-08-22 19:26:

    On 8/22/2022 10:59 AM, Arno Welzel wrote:
    Dale, 2022-08-22 00:15:

    On my iPhone-6s my videos only show an arrow to start with.

    This is by design. Browsers do not allow autoplay videos if they are not
    muted. The only allowed way to let a video play is after a user interaction. >>

    Not looking for an autoplay. What's its value?

    there isn't an image to start with behind the arrow on the iPhone, using Chrome, just an arrow

    Yes, this is by design. Ask Apple about that.

    Chrome and Edge on Windows 10 have an image in its toolbar

    Yes, this is by design - Google and Microsoft decided to do it this way.

    Amazon Silk on a Fire-TV has an image with a centered arrow, but no
    arrow in its toolbar

    Again - because Amazon liked to have it so.

    If you don't like this, you need to create your own image with an
    surrounding <a> element which is display *instead* of the video. Then
    add a JavaScript onclick handler which will hide the image and then
    reveal the video behind it and start the video playing.



    --
    Arno Welzel
    https://arnowelzel.de

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Arno Welzel on Tue Aug 23 17:19:21 2022
    On 8/23/2022 9:33 AM, Arno Welzel wrote:
    Dale, 2022-08-22 19:26:

    On 8/22/2022 10:59 AM, Arno Welzel wrote:
    Dale, 2022-08-22 00:15:

    On my iPhone-6s my videos only show an arrow to start with.

    This is by design. Browsers do not allow autoplay videos if they are not >>> muted. The only allowed way to let a video play is after a user interaction.


    Not looking for an autoplay. What's its value?

    there isn't an image to start with behind the arrow on the iPhone, using
    Chrome, just an arrow

    Yes, this is by design. Ask Apple about that.

    Chrome and Edge on Windows 10 have an image in its toolbar

    Yes, this is by design - Google and Microsoft decided to do it this way.

    Amazon Silk on a Fire-TV has an image with a centered arrow, but no
    arrow in its toolbar

    Again - because Amazon liked to have it so.

    If you don't like this, you need to create your own image with an
    surrounding <a> element which is display *instead* of the video. Then
    add a JavaScript onclick handler which will hide the image and then
    reveal the video behind it and start the video playing.




    Thank You !

    With the differences I see based on browser/OS I'm going to stick with
    it as is

    and perhaps I worry about using cookies and scripts too much

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Dale on Tue Aug 23 21:57:14 2022
    On 8/21/2022 6:15 PM, Dale wrote:
    Hi,

    On my iPhone-6s my videos only show an arrow to start with.

    Pressing the arrow works fine.

    Just thinking this isn't obvious to the visitor.

    The videos can be found here ...

    https://www.dalekelly.org/weblog.html

    I have this in the head ...

    <head>

        (other stuff ...)

        <style>
            video {
                    max-width: 100%;
                    height: auto;
                }
        </style>

    </head>

    and here is an example video code ...


        <video controls>
              <source src="https://www.dalekelly.org/images/newwebcam.mp4"
    type="video/mp4">
            Your browser does not support the MP4 video tag.
        </video>





    options here ...

    https://github.com/dalekellytoo/html_videos/

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From =?UTF-8?B?SvCdlZLwnZWe8J2VlvCdlaQg8@21:1/5 to Dale on Sat Aug 27 14:23:18 2022
    In Message <tduap6$2eoac$1@dont-email.me>
    On Sunday Aug 21, 2022 6:15 pm -04:00
    Dale <dale@dalekelly.org> wrote:

    Hi,

    On my iPhone-6s my videos only show an arrow to start with.

    Pressing the arrow works fine.

    Just thinking this isn't obvious to the visitor.

    The videos can be found here ...

    https://www.dalekelly.org/weblog.html

    [snip]

    MDN is a good resource. Information about the video element can be
    found here.
    https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video


    Preload attribute: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video#attr-preload

    Prehaps preload="metadata"

    If that does not produce the results you are looking for then perhaps
    the poster attribute: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video#attr-poster

    poster="yourImage.jpg"

    --
    J𝕒𝕞𝕖𝕤 𝕂𝕚𝕣𝕜

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)