Création de plugin
Dans cet exercice, nous allons apprendre à utiliser les plugins mais aussi à les créer. Pour cela, vous allez devoir reprendre le code que vous avez écrit lors du premier exercice.
Question
Affichez :
un sous-titre entre t = 2s et t = 3s contenant "Cet exercice est génial !"
un popup à t = 5s affichant "Pas tant que ça en fait"
Indice
Pour les sous-titres, utilisez le plugin subtitle.
Pour le popup, utilisez le plugin code et la fonction alert().
Solution
1
pop.subtitle({
2
start: 2,
3
end: 3,
4
text: "Cet exercice est genial",
5
});
6
7
pop.code({
8
start: 5,
9
onStart: function( options ) {
10
alert("Pas tant que ca en fait...");
11
}
12
});
Question
Créez un plugin "christmas" qui permet d'entourer la vidéo d'une aura rouge
Indice
Pour accéder à l'élément vidéo, utilisez this.media
Pour l'aura, on pourra utiliser un style css tel que : box-shadow: 0px 0px 60px red ;
Solution
1
Popcorn.plugin( "christmas" , {
2
start: function( event, options ){
3
this.media.style['box-shadow'] = '0px 0px 60px red';
4
},
5
end: function( event, options ) {
6
this.media.style['box-shadow'] = '';
7
},
8
});
9
var p = Popcorn( "#video" ).play().christmas({start: 0,end: 5});
