I have a wordpress site. We want a video in the background. I have done this like so:

<?php if(is_page('homepage')){ ?>
<div id="video_background_video_0" style="z-index: 0; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; overflow: hidden;">
            <iframe id="video_background_video_0_yt" style="position: absolute; top: -179px; left: 0px;" frameborder="0" allowfullscreen="1" title="YouTube video player" width="1349" height="759" src="https://www.youtube.com/embed/1CXFhQ33_xs?loop=0&amp;start=0&amp;autoplay=1&amp;controls=1&amp;showinfo=0&amp;wmode=transparent&amp;iv_load_policy=3&amp;modestbranding=1&amp;rel=0&amp;enablejsapi=1&amp;origin=http%3A%2F%2Fwww.onscreencounselling.com"></iframe></div>

        <?php } ?>    

and it works. It is here www.onscreencounselling.com

Only thing is we are keen to be able to control the video - is that possible. At the moment, since we have content on top of the video teh controls aren't clickable - which I guess isn't too surprising really -

any ideas please?

Recommended Answers

If you use the HTML5 video tag instead of loading a youtube vid into an iframe you can have your own control buttons placed ontop of the video, especially the volume control in your case :).

This might get you started:

Jump to Post

All 3 Replies

yes thanks gentlemedia - I could do that I guess, just keen to use youtube because it normally solves so many of those pesky video problems.

just keen to use youtube because it normally solves so many of those pesky video problems

I know what you're saying and 3 years ago that was a fact, but today the video tag is a pretty solid solution with greater control and your users don't have to wait untill finally that YouTube vid is loaded into that iFrame :)

And also remember that autostart is not supported on iDevices.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.21 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.