Video containers and html5

How can I use the video container / source and not display an image or poster before the user click on the video link? I have several videos to display on one page, and only the links should be visible on the page.

I can of course do this without any container, but I would like to use the container to help choosing the correct file format for the browser.

novice (to ninja)

You have to actually choose to include a poster on a video element, so if you don’t want one, don’t choose it. That is, leave off the bit in red:

<video controls [COLOR="#FF0000"]poster="placehlder.png"[/COLOR]>

That is not enough, you also have to use preload=“none”. But even that is not enough for me. I have links to several videos on my page (http://alvenes.net/events4.html) and I just want to show the links on the page. So, how to do that?

I’m confused. That’s what you have there—links. What’s the issue? Do you men on the landing page those links point to? Each browser will deal with that differently, but these days, most will play the video on the page. Do you want to prevent that? You could force the video to download instead, if thats what you want.

It is not a big issue, as you have seen I use usual links. However, using containers would be an easy way to let the different browsers choose the best file format - mp4, webm or ogg. This could be done by js, I guess, but … . I just tried to find out if there is an easy way to use containers and still only showing the links.

Ah, I see now.

One option would be to link to a page rather than to a video file. You could put a normal video element on each page that offered up the various different video formats as usual. It would mean you’d have to set up a separate page for each link, but if you had a template ready to go, that would be a minor thing, really—just duplicate the page (or folder) and alter the video names each time.

Tank you, I have thought of something like that. However, it would be nice to be able to “hide” the container in a better / easyer way.

I’m not quite sure what you mean by “hide the container”, to be honest. Do you mean on the landing page?

Yes, I would like that only the link should be shown on the landing page.

You want them to click a link, then arrive at a page with just a link on it? A link that does what? I’m still baffled. Unless you can give a fuller explanation of what you want, I can’t help you.

No, I would like to use a container to choose the correct file format, but I don’t want the container shown on the web page (it uses to much space on the page). The user should just see a link (or something else about the size of a link and showing that it is a link to a video). I have not found a way to solve this (except link to another page as you mentioned), so I only use links.

Hm, all I can think of is that most video containers have an option to view full screen. You can link to YouTube videos in full screen mode. I don’t think HTML5 video has such an option, but there are ways to make the video play full screen, such as this: http://demosthenes.info/blog/777/Create-Fullscreen-HTML5-Page-Background-Video

I just want to use the video container and the “source src=…” statement to choose among file formats, but the user should only see the link to a file. The video should not open before the user click on the link.

Hm, it seems to me that demo provides exactly what you were looking for—a link that point to a page with a video container on it that plays the video at full screen.

Yes, for me this is the best way to do the job using containers. Thank you!