[SOLUCIONADO] Por qué se descentra la imagen al consultar si esta es más ancha que su contenedor

[fcotorgi]

Tengo el siguiente código dentro de una función PHP. El problema es que al introducir como activo el código que he comentarizado la imagen coloca su esquina superior izquierda en el centro del div overlay. Si lo comentarizo, la imagen se muestra perfectamente centrada. ¿Alguien puede ayudarme?. Gracias.

================================================== ==

print_r(" <script type='text/javascript'>\n");
print_r(" function toggleOverlay(ruta, altura, anchura){\n");
print_r(" var overlay = document.getElementById('continente');\n");
print_r(" var specialBox = document.getElementById('contenido');\n");
print_r(" var imagen_seleccionada = document.getElementById('imagen_seleccionada');\n" );
print_r(" overlay.style.opacity = .8;\n");
print_r(" if(overlay.style.display == 'block'){\n");
print_r(" overlay.style.display = 'none';\n");
print_r(" specialBox.style.display = 'none';\n");
print_r(" }else{\n");
print_r(" if(altura > overlay.style.hight){\n");
print_r(" altura_ajustada = overlay.style.hight;\n");
print_r(" ratio = altura_ajustada / altura;\n");
print_r(" altura = altura_ajustada;\n");
print_r(" anchura = anchura * ratio;\n");
print_r(" }\n");
/* ERROR: COLOCA LA COORDENADA (0, 0) DE LA IMAGEN EN EL CENTRO
print_r(" if(anchura > overlay.style.width){\n");
print_r(" anchura_ajustada = overlay.style.width;\n");
print_r(" ratio = anchura_ajustada / anchura;\n");
print_r(" anchura = anchura_ajustada;\n");
print_r(" altura = altura * ratio;\n");
print_r(" }\n");
*/
print_r(" mitad_altura = altura/2;\n");
print_r(" mitad_anchura = anchura/2;\n");
print_r(" overlay.style.display = 'block';\n");
print_r(" specialBox.style.display = 'block';\n");
print_r(" specialBox.style.height = altura+'px';\n");
print_r(" specialBox.style.width = anchura+'px';\n");
print_r(" specialBox.style.marginTop = '-'+mitad_altura+'px';\n");
print_r(" specialBox.style.marginLeft = '-'+mitad_anchura+'px';\n");
print_r(" imagen_seleccionada.src = ruta;\n");
print_r(" imagen_seleccionada.marginTop = '0px';\n");
print_r(" imagen_seleccionada.marginLeft = '0px';\n");
print_r(" }\n");
print_r(" }\n");
print_r(" </script>\n");

================================================== =======

[Panino5001]

Veo algunos errores, por ejemplo: hight. Debería ser: height.
Otro error:

Código PHP:

  if(anchura > overlay.style.width) 
   

overlay.style.width es un string, ya que es un número seguido de la unidad px; es decir, no son valores comparables. Podrías usar:

Código PHP:

  if(anchura > parseInt(overlay.style.width)) 
   

Por otro lado, en php no deberías usar print_r como función de salida de texto. Deberías usar print o echo o la sintaxis heredoc. Esto es porque no sólo es más lenta sino que además, si te ves forzado a usar el buffer, print_r te dará problemas.

[fcotorgi]

Un millón de gracias. Mañana lo probaré y te digo. :D

[fcotorgi]

Funcionó. Muchas gracias. Haré caso de tu consejo, Panino.