CODEWITHSUNDEEP
javascripthtmlcssvideovimeo
Jesse Atkinson
Jesse Atkinson

Reputation: 11406

How to hide title when video is played?

I have put my own custom title absolutely positioned over the top of an Vimeo video embed (you can see the dev site here http://ourcityourstory.com/dev/). When I click on the Vimeo video I want the title absolutely positioned over it to hide.

How do I accomplish this? None of the JS I'm writing is working.

Here is my non-working code:

$(document).click({namespace: this}, function (e) {
    var t = e.data.namespace;

    if ($(e.target).parents("#video-slider-wrapper iframe").length > 0 || $(e.target).is($("#video-slider-wrapper iframe"))) {
        $("#episode h1").hide();
    }
});

UPDATE: pimvdb's example listed below does exactly what I need my page to do — however, I keep getting the error "$f is not defined" on my page.

Upvotes: 0

Views: 2430

Answers (1)

pimvdb
pimvdb

Reputation: 154818

Your click handler does not work because the iframe is cross-domain. However, you can use the dedicated Vimeo API to add a listener when the play event is fired:

var player = $f( $('#player1').get(0) );

player.addEvent('play', function() {
  $("h1").hide();
});

​

Upvotes: 1

Related Questions