Reputation: 59
I'm trying to implement some video tracking to our Vimeo videos on our website. I've got it too work for Play/Finished however i also need to do it for 25%, 50%, 75%.
This is my current code
$(document).ready(function() {
var iframe = document.querySelector('#vimeo_id_0');
var player = new Vimeo.Player(iframe);
//Track videos on Play
player.on('play', function(data){
player.getVideoTitle().then(function(title) {
$('body').append('<div>Play:' + title + '</div>');
});
//ga('send', 'event', { eventCategory: 'Video', eventAction: 'Play', eventLabel: 'Video Play'});
});
//Track videos at percent played
player.on('timeupdate', function(data){
player.getVideoTitle().then(function(title) {
console.log(data.percent);
if(data.percent = 0.25) {
//25% percent
$('body').append('<div>25%' + title + '</div>');
} else if (data.percent = 0.50) {
//50% percent
$('body').append('<div>50%' + title + '</div>');
} else if (data.percent = 0.75) {
//75% percent
$('body').append('<div>75%' + title + '</div>');
}
});
});
//Track videos on End
player.on('ended', function(data){
player.getVideoTitle().then(function(title) {
$('body').append('<div>Ended:' + title + '</div>');
//ga('send', 'event', { eventCategory: 'Video', eventAction: 'Finished', eventLabel: 'Video Finished'});
});
});
});
<script src="https://player.vimeo.com/api/player.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://player.vimeo.com/video/260024854' id="vimeo_id_0" frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div>
I'm trying to get it so when it timeupdate percent hits 0.25 it will fire the event and thats it, However it starts firing straight away and fires every single time the timeupdate call updates which would mean we will track loads of events in Google Analytics
Any help would be appreciated. Thanks
Upvotes: 0
Views: 2405
Reputation: 21
In your if statement you are missing another equal sign. It should be:
if (data.percent == 0.25)
Upvotes: 2