Accordion jquery / lecture video

Version imprimable

10/05/2012, 15h16
bipbipman2003

Accordion jquery / lecture video

Bonjour,
En utilisant jquery et jquery ui je cherche a mettre une video dans mon accordion.
Jusque là pas de soucis mais si je lit cette video et que je change d'onglet, la video continue de tourner, comment faire pour ré-initialiser cet onglet avec la video dans son état initial lorsque l'on revient ou l'on quitte cet onglet ?

PS: Je pensais que cela n'était pas possible mais j'ai vu certaines videos dans des accordion fonctionnant comme ceci mais je n'ai pas compris comment ...
11/05/2012, 09h28
bipbipman2003

Pas d'idées ?
En fait je voulais mettre une video dans chaque onglet, c'est pour cela que c'est gênant d'avoir la video qui continue lorsque l'on passe a un autre onglet.
13/05/2012, 23h46
Macmillenium

Elle est chargée comment ta vidéo, flash? <video>?
14/05/2012, 16h41
bipbipman2003

c'est dans une iframe integration du code you tube : <iframe width="420" height="315" src="http://www.youtube.com

Je viens de me rendre compte en fait que cela dépend du navigateur, cela fonctionne sur certains.

Tu as peut être une idée la dessus:
Lorsque je change d'onglet avec la video, celui ci saccade car il charge la video en même temps de l'effet, que puis faire ? Peut être afficher un div avec la video à la fin de l'effet ou précharger cette video you tube mais je ne sais pas si c'est possible ?
Si je supprime l'effet il devient rapide.
15/05/2012, 09h42
bipbipman2003

Après plusieurs test sur différents navigateurs:

- firefox la video revient au début mais le changement d'onglets avec effet est saccadé.

-chrome et opéra la video continue de tourner même lors du changement d'onglets mais le passage entre les différents onglets est très fluide.
15/05/2012, 10h47
Macmillenium

Regarde du coté de l'API Youtube, normalement tu dois pouvoir arrêter ta vidéo en changeant d'onglet avec la méthode stopVideo()
16/05/2012, 11h34
bipbipman2003

Voilà j'ai rajouté un pauseVideo lorsque il y a un évenement change sur l'accordion.
Cela fonctionne bien avec chrome.
Avec firefox il recharge l'onglet a chaque fois, il n'y a pas moyen de ne pas le recharger pour éviter un effet saccadé lors du changement d'onglets ?
16/05/2012, 21h30
Macmillenium

Citation:

Envoyé par bipbipman2003

Voilà j'ai rajouté un pauseVideo lorsque il y a un évenement change sur l'accordion.

Un événement change sur l’accordéon :koi:
Cet événement est réservé aux éléments de formulaires.
Tu peux nous montrer ton code ou une page en ligne stp?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
  var player1;
  var player2;
  function onYouTubePlayerAPIReady() {
      player1 = new YT.Player('player1');
      player2 = new YT.Player('player2');
 
  }
 
 
  $(function() {
      var icons = {
          header: "ui-icon ui-icon-circle-triangle-e",
          headerSelected: "ui-icon ui-icon-circle-triangle-s"
      };{
 
       $( "#accordion" ).accordion({ 
       autoHeight:false, animated: false,
       collapsible: true, 
       active: false,
       icons: icons, 
       change: function(event, ui) { player1 .pauseVideo();player2.pauseVideo();}});
 
  });

29/05/2013, 11h46
Bovino

Il n'y a pas quelque chose qui te choque dans la coloration syntaxique ? :whistle:
29/05/2013, 16h25
bipbipman2003

Voilà, désolé j'ai fait une mauvaise copie.