Question

Im looking to create a landing page that emulates DropBox (in wordpress). I was wondering how they achieved the effect of clicking the play button that overlays the background box that then turns into a video?

I see from the source that they are using JW player but again no clue on where to start with this. Are there skins you can buy that allow this? Any ideas to lead me in the right direction are appreciated.

Thanks

Answer 1

Can be done easily with jquery and css. First, absolute position both divs centrally on the page so that when visible one is on top of the other, then set the video div css to “display:none;”. Then you can use jquery to show the video and hide the play button on click, something like this:

$(function(){
    $('#play-btn').click(function(){
        $('#play-btn').hide();
        $('#video').show();
    });
});

Simply done mi amigo. Bare in mind they don’t have to be centered, they just have to be positioned one above the other…