Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I'm trying to harness Vimeo's Froogaloop API to pause video embeds whenever a user clicks a certain element. I have it working perfectly in my Fiddle but it wont work in my Wordpress environment.

I took some code from this thread to create a simplified version of the site I'm working on;

HTML

<div id="player1" class="col">
    <div class="vid">
        <iframe src="//player.vimeo.com/video/75817361?title=0&amp;byline=0&amp;portrait=0&api=1" width="100%" height="auto" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    </div>
</div>

<div id="player2" class="col">
    <div class="vid">
        <iframe src="//player.vimeo.com/video/7038107?title=0&amp;byline=0&amp;portrait=0&api=1" width="100%" height="auto" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    </div>
</div>

<a class="pause" onclick="pauseAll(); return false;" href="#">Pause</a>

jQuery

function pauseAll() {
$('iframe[src*="vimeo.com"]').each(function () {
    $f(this).api('pause');
});
}

As I say, it works perfectly in my Fiddle but not in my WP based site It also seems to just be Google Chrome where it doesn't work in WP which is making me scratch my head even more.

If anyone has any ideas it would be a great help.

share|improve this question
1  
The jQuery included with WordPress is set to noConflict mode so the $ shortcut isn't available until you make it available. Double check that isn't the problem. –  helgatheviking Jan 20 at 19:53
    
@helgatheviking I use $ everywhere else and I don't have any problems. I've also tried replacing it with jQuery and the problem still persists –  Poisontonomes Jan 20 at 21:05

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.