Vimeo problems with Jquery fancybox + infinite carousel

Question

Another Vimeo-related problem from a javascript noob...

I've set my problem up here: http://jsfiddle.net/ajtTF/

When the link is clicked, it will load up an inline Fancybox modal with a Jquery inifinite carousel gallery. The gallery currently consists of 2 embedded Vimeo videos.

All is fine, until the modal is closed, and then re-initiated. The modal now, for some reason, replaces the second video with the first video (ie, displays 2 instances of the same video, disregarding the other one).

I will eventually want several videos in this situation. I don't know if this is something worth taking into account if applying some additional js.

Many thanks in advance, and I must stress my js skills are pretty non-existent, so please be clear! Feel free to mess with my example.

Answer 1

http://jsfiddle.net/ajtTF/6/

Hej im not sure why the src of the iframes are being cleared out when you close the modal.

It dosent seem to be part of your code so i asume it has something to do with fancybox.

Anny way the reason that you previos code didn't work is because you took the src from the first iframe when the modal loded, and then you applied it to both iframes when the modal closed.

so when you opened it agenn it had the same src on both iframes.

this code saves the src for each of the frames separately. It wont matter if you have 2 or 10 iframes with this code.

GL

  'onComplete': function() {
    $("#inline2 iframe").each(function(i) {
     $(this).data("src", $(this).attr("src"));
    });
  }, 

  'onClosed': function() {
   $("#inline2 iframe").each(function(i) {
    $(this).attr("src", $(this).data("src"));
   });
  }