Regresar a la página www.ComoCrearTuWeb.com
Resultados 1 al 6 de 6

Tema: Problema con Zoom de smartphones en página hecha con responsive design

  1. #1
    Me va gustando esto... Habitante
    Fecha de Ingreso
    05 jul, 12
    Mensajes
    94
    Poder de Reputación
    8

    Problema con Zoom de smartphones en página hecha con responsive design

    Estimados colegas:

    Estoy diseñando mi primera página web con responsive design utilizando CSS. Hasta ahora las cosas van lentas, pero bien.

    Mi página primera de prueba está respondiendo correctamente en todos los anchos de los navegadores de escritorio, incluyendo al reducirlos hasta que su anchura más pequeña.
    Después de esas pruebas cargué la página en mi Smartphone NOKIA 5800 que utiliza Symbian.

    Mi principal problema es el siguiente:

    La página de prueba se ha cargado correctamente y cuando giro el teléfono, la página adapta elementos internos a la nueva anchura.
    Eso está bien, pero ......... cuando hago zoom en la página (con doble clic en la pantalla), la página se amplía y el navegador vuelve a estrechar los elementos internos a la nueva anchura más estrecha y no quiero eso. No quiero que la página responda en el zoom.
    Quiero que los elementos sólo se amplíen cuando puedo hago zoom en la página. Estoy explicándolo correctamente? Mi página parece ser demasiado sensible "responsiva"!!! :)

    En otras palabras .... aunque la página adapta los DIVs (etc) a la anchura más estrecha en los navegadores de escritorio, el problema es cuando hago zoom en las pantallas más pequeñas (teléfonos inteligentes), debido a que algunos elementos se estrechan demasiado en el navegador del celular con zoom y hay elementos que no quedan bien porque se hace todo demasiado estrecho.

    ¿Hay alguna forma en CSS para evitar el efecto de respuesta cuando se hace zoom???
    O quiza alguna instrucción HTML que evite la adaptabilidad de los elementos cuando se hace zoom.
    ¿¿¿¿¿ Quizá en la instrucción <meta name="viewport" content="width=device-width, initial-scale=1"> ?????????

    Espero haber explicado esta cuestión con claridad para que alguien me pueda ayudar.
    Gracias de antemano!!!!!!!!!
    GusSiglo21

  2. #2
    Esto empieza a ser un vicio... Habitante Avatar de Doodleo
    Fecha de Ingreso
    25 abr, 11
    Ubicación
    Galicia (España)
    Mensajes
    1,329
    Poder de Reputación
    17
    Pues la verdad no te puedo ayudar pero encontré un artículo muy interesante sobre el responsive design... http://blog.ikhuerta.com/transforma-...ponsive-design
    Prueba este código (es como el que tu pusiste en verdad) en el head de la página:
    Código HTML:
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

  3. #3
    Me va gustando esto... Habitante
    Fecha de Ingreso
    05 jul, 12
    Mensajes
    94
    Poder de Reputación
    8
    Hola Doodleo!

    Estoy leyendo tranquilamente el extenso artículo que me enviaste.
    Está muy interesante!!!!!
    Lamentablemente y al parecer, esa etiqueta <meta name="viewport" content="width=device-width, initial-scale=1.0" /> no sería la que detecta el zoom para que al aumentar la pantalla no siga adaptándose, pero bueno, tendré que seguir investigando!

    Igualmente muchas gracias por el dato y tu tiempo!
    Un abrazo desde Argentina!!!!!
    GusSiglo21

  4. #4
    Recien Llegado! Pasaba por aquí...
    Fecha de Ingreso
    27 sep, 15
    Ubicación
    Mérida
    Mensajes
    1
    Poder de Reputación
    0
    Yo estoy tratando de arreglar una plantilla Wordpress Responsive. El problema que tengo es que el responsive tiene las medidas del iPhone aparentemente y cuando entras por cualquier otro dispositivo con pantalla más grande, no hace el cambio, se sigue viendo igual. Esta es la pagina web de Turismo en la que tengo el problema a ver si le pueden echar un ojo.

    Saludos!

  5. #5
    Me va gustando esto... Habitante
    Fecha de Ingreso
    30 sep, 15
    Mensajes
    34
    Poder de Reputación
    4
    Lo que necesitas para solucionar eso es poner un min-width, min-height en los DIV pertinentes, de esa manera ante un zoom mayor o menor no se irá del límite que tu le indiques en los estilos CSS.
    Mi pequeña y humilde web: Fiuxy

  6. #6
    Me va gustando esto... Habitante Avatar de CircuitoX
    Fecha de Ingreso
    29 nov, 09
    Mensajes
    66
    Poder de Reputación
    12
    Prueba poniendo esto dentro de la etiqueda head

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    My website responsive, html5, puro css y con Animación css3 web cusco
    Algo Diferente Paginas web Cusco
    Si necesitas ayuda con algo, entonces:
    http://www.google.com/+NestorMinaweb

Temas Similares

  1. Diseño responsivo (Responsive deign)
    Por Pedro-vk en el foro Adaptar o Crear una web para móviles
    Respuestas: 12
    Último Mensaje: 05/02/2016, 12:44
  2. Funcion para dar zoom o quitar zoom
    Por mrtrujis en el foro Foro General
    Respuestas: 4
    Último Mensaje: 22/07/2012, 18:20
  3. Problema pie pagina web hecha por vuestro curso
    Por yolidelanati en el foro Foro General
    Respuestas: 3
    Último Mensaje: 02/12/2011, 15:58
  4. Web ideal para MOVILES/SMARTPHONES
    Por pelotadetenis2 en el foro Sugerencias
    Respuestas: 1
    Último Mensaje: 09/05/2011, 06:26
  5. Problema de mi web con el zoom de los navegadores
    Por lobo91 en el foro Foro General
    Respuestas: 8
    Último Mensaje: 06/03/2011, 21:29

Etiquetas para este Tema

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •