Simplificaré mi pregunta. Resulta que tengo mi función para agrandar una imagen a pantalla completa, lo cual me funciona en google chrome. Tengo el siguiente código:
<img id="imagen_test" src="../../Archivos/Noticias/Fotos/14-01-2016/hhhhasas/CAM00414.jpg" style="height:180px;width:100px;max-width:120px;" />
<input id="Button1" type="button" value="button" />
$("#Button1").click(function (ev) {
launchFullScreen(document.getElementById('imagen_test'), 'imagen_test');
});
function launchFullScreen(element, id_imagen) {
if (element.requestFullScreen) {
element.requestFullScreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
$('#' + id_foto_full).addClass('aumenta_imagen');
}
.aumenta_imagen{
width:80% !important;
max-width:none !important;
height:100% !important;
}
Pero cuando lo pruebo en mozilla, para agrandar la en pantalla completa, ocurre lo siguiente:
Ocupa todo el ancho y alto, lo cual hace que la imagen se vea desproporcionada.
Me gustaría saber, que también en mozilla, se vea bien la imagen en pantalla completa.