/ / Ridimensiona fancybox in base alle dimensioni del video vimeo: jquery, fancybox, vimeo

Ridimensiona le dimensioni di fancybox in vimeo - jquery, fancybox, vimeo

Ho alcune miniature dei video su una pagina web. Quando faccio clic su uno, voglio che un fancybox si apra e riproduca il video Vimeo senza barre nere, quindi le proporzioni devono essere corrette. Sfortunatamente, fancybox non è in grado di rilevare la giusta larghezza e altezza del video.

Ho scritto del codice jquery ma sono bloccato nell'ultimo passaggio:

var $height = screen.height/2;
var $aspectRatio = 16/9; // Default aspect ratio
var $width = $aspectRatio * $height; // Default width

$("a.fancybox-media").fancybox({
openEffect  : "none",
closeEffect : "none",
width : $width,
height : $height,
autoDimensions : false,
beforeLoad : function() {
var $vimeoVideoID = jsTheme.fancybox.getVimeoId(this.href);

$.getJSON("http://www.vimeo.com/api/v2/video/" + $vimeoVideoID + ".json?callback=?", {format: "json"}, function(data) {
// Calculate aspect ratio & new width
$aspectRatio = data[0].width / data[0].height;
$width = $aspectRatio * $height;
}).done(function() {
// Resize fancybox to this width & height. Doesn"t work!
this.width = $width;
this.height = $height;
});
}
});

Posso fare la chiamata API e recuperare la larghezza e l'altezza dall'API Vimeo. Calcolo la nuova larghezza in base a queste proporzioni. Ma non posso impostare la larghezza. Anche se codifico la larghezza nel file done funzione come this.width = "3000" non aggiorna fancybox.

Se metto this.width = "3000" al di fuori della funzione svolta, funziona. Sembra che non riesca ad aggiornare fancybox dalla funzione finita. Posso forzare questo aggiornamento? Qualcuno ha un suggerimento?

risposte:

0 per risposta № 1

Prova questo : (Ottieni prima i dati, quindi apri Fancybox)

var id = 132693003;
$.ajax({
dataType: "json",
url: "http://www.vimeo.com/api/v2/video/" + id + ".json?callback=?",
success: function (json) {
var w = json[0]["width"];
var h = json[0]["height"];
$.fancybox.open({
width: w,
height: h,
maxWidth: 1240,
padding: 0,
type: "iframe",
aspectRatio: true,
scrolling : "no",
href: "//player.vimeo.com/video/" + id + "?color=d50000&autoplay=1&hd=1&show_title=0&show_byline=0&show_portrait=0&fullscreen=1"
});
}
});

PS : Senza supporto multimediale Fancybox</ Em>