anchura y altura problema con FancyBox

Question

Cuando he añadido el código ningún ajuste en anchura y altura funciona

jQuery(document).ready(function() { 
    $('a.iframe').fancybox(); 
}); 

¿Cuáles son las opciones para conseguir alrededor de él?

Answer 1

Tome un vistazo a la documentación aquí: http://fancybox.net/api

Usted está utilizando el contenido en línea, así que asegúrese de que se está configurando la opción autoDimensions a falso, junto con los valores de anchura y altura.

ACTUALIZACIÓN: He probado con éxito la siguiente solución:

$('a.fbtag').fancybox({ 
     autoDimensions: false, 
     height: 300, 
     width: 400 
    }); 

Esto supone que el nombre de la clase del enlace que está abriendo es 'fbtag'.

Answer 2

anchura Fancy Box y Altura siempre varía con el tipo de medio.

Si proporcionamos una imagen de 5 * 5 píxeles, Fancy Box se mostrará con las dimensiones de las Dimensiones de la imagen.

para contrarrestar el efecto de las dimensiones de los medios y definir la anchura & altura predeterminada para Fancy Box

Prueba esto:

$.fancybox.open(collection.toJSON(), { 
    afterShow :function(){}, 
    maxHeight : 600, 
    minWidth : 500   
}); 

anchura FancyBox habrá mínimo - 500 píxeles.

FancyBox La altura será proporcional a los datos de FancyBox con una altura máxima de 600 píxeles.

Answer 3

Por ejemplo

$.fancybox({ 
    'content':"This will be the content of the fancybox", 
    'width':'500', 
    'autoDimensions':false, 
    'type':'iframe', 
    'autoSize':false 
}); 

Answer 4

$(document).ready(function() { 
    $(".fancy-ajax").fancybox({ 
     type:   'ajax', 
     autoDimensions: false, 
     'autoSize':  false, 
     'height':  'auto' 
    }); 
}); 

Los códigos anteriores trabajó para mí. Sin embargo, estaba diseñando en Twitter Bootstrap.

Answer 5

Esto se puede hacer de dos vías

Con iframe

$(document).ready(function() { 
     $(".fancybox").fancybox({ 
      width:600, 
      height:400, 
      type: 'iframe', 
      href : 'url_here' 
     }); 
    }) 

Sin iframe

$(document).ready(function() { 
    $(".fancybox").fancybox({ 
     width:600, 
     height:400, 
     autoDimensions: false, 
    }); 
})