Vide doesn't work on Chrome

[kaspar-allenbach]

So strange, I can't get your plugin to work in chrome.

In FF it works fine. In chrome it generates this code:

<div
  class="index_startwrapper"
  id="startwrapper_trigger"
  data-vide-options="posterType: jpg"
  data-vide-bg="webm: //domain.dev/assets/src/video/xyz.webm,
  poster: //domain.dev/assets/src/video/xyz.jpg">
  <div style="position: absolute; z-index: -1; top: 0px; left: 0px; bottom: 0px; right: 0px; overflow: hidden; background-image: url(&quot;//domain.dev/assets/src/video/bantiger.jpg&quot;); background-size: cover; background-position: 50% 50%; background-repeat: no-repeat;">
    <video autoplay="" loop="" muted="" style="margin: auto; position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); visibility: hidden;">
    <source src="//domain.dev/assets/src/video/xyz.webm" type="video/webm">
    </video>
  </div>
</div>

• The fallback jpg works fine
• No console errors
• If I paste the video url into a new browser tab it works fine.
• I converted the video with miro. So this shouldnt be the problem.

What else could this be?

[ghost]

Do you have a MP4 as well? Usually you want to have all 3 videos; webm, mp4, and ogv

[kaspar-allenbach]

Yes. I have all three formats implemented. I stripped out code to circle the problem. I went for webm in this example because it seems to be the prefered format for chrome. Further examination revealed that is doesn't work on safari either. So it must be a webkit thing?

[ghost]

AFAIK, webkit prefers mp4 , but I could be incorrect. But we normally make sure that we have all 3 videos accessible.

Can you paste in you JS?

[kaspar-allenbach]

I'll strip the code to the mp4 then. Let's see what happens then.

[kaspar-allenbach]

It seems to be a problem with autoplay. I embeded the video with the native html5 video tags:

<video autoplay="autoplay" controls="controls" preload="auto">
      <source src="the_video.mp4" type="video/mp4"  />
  </video>

This doesn't work either until I hit play. Does something changed with the autoplay behaviour?

There seems to be some threads on Se (https://stackoverflow.com/questions/17994666/video-auto-play-is-not-working-in-safari-and-chrome-desktop-browser) about this

[kaspar-allenbach]

I could get it to work with $('#videContainer video').get(0).play() Not very pretty. But that does the job.

[JensNielsen81]

Same problem her. The video wont play. The strange part is, that all the demo files work just fine in chrome, but as soon as i use it on my owen stuff, the video wont play i chrome/safari.