Ver Mensaje Individual
  #2 (permalink)  
Antiguo 25/11/2014, 15:26
juangemelo01
 
Fecha de Ingreso: marzo-2011
Ubicación: Oaxaca
Mensajes: 252
Antigüedad: 13 años, 8 meses
Puntos: 17
Respuesta: Diseño líquido no funciona como debería

Hola amigo, no entiendo exactamente cual es tu problema
de lo que me doy cuenta es que tienes un tipo de slider que funciona de manera horizontal y vertical,
de manera vertical tienes solo 3 elementos.
de manera horizontal, solo el 1er elemento tiene 3 elementos (con el son 4)
con respecto a la vista reducida en el navegador de la pc para simular la pantalla movil, es normal que los elementos verticales se desplacen a mano izquierda y no se vean, ya que hay un elemento que tiene la propiedad
Código:
overflow:hidden;
lo que hace esta propiedad es que tu tienes un elemento de un ancho y un alto definido, todo lo que este excediendo de ese ancho o alto, no se vera. Es como si fuera un escenario de una obra de teatro, no puedes ver nada que se encuentre a mano derecha, izquierda, en lo alto o debajo de el, ya que a la vista no queda oculto, pero, eso no quiere decir que no haya algo en esos lugares.

ahora bien, si lo que no te gusta es que se vea el 2do elemento en vertical cuando se esta mostrando el primer elemento y no han dado clic en la flecha inferior, te dier que ahi no puedes hacer nada amigo

el chiste del diseño liquido es que el ancho de nuestra web se adapte al ancho de un dispositivo movil, el alto tiene que ser dinámico, eso le permite al usuario deslizar con el dedo el contenido de la web para poder disfrutar con la mayor comodidad sin forzar la vista y con movimientos naturales el contenido de nuestro sitio, cuando se logra eso, decimos que el usuario esta gozando de la mejor experiencia que puede tener al navegar en nuestro sitio desde un dispositivo movil.

Lo que sucede con el slider de tu web en un pc, laptop, etc. es que el alto de cada elemento abarca todo, como la pantalla es amplia, podemos ver bien todos los elementos que contiene cada elemento de manera correcta, pero ¿que sucede si muestras esa misma pantalla en un dispositivo de 320x240? (claro seria una vista en escala), al pobre usuario lo veras usando una lupa(ya sea la del navegador o una fisica) para poder leer el texto de tu web y darle "click" (o tocar) al elemento del menu que desee sin tocar 2 o mas por accidente, pobre usuario, sufriría tanto que no creo que quiera visitar el sitio desde el movil nuevamente.

ahora bien, por lo que veo, la parte liquida del los elementos horizontales tampoco estan funcionando como deberian ser, ya que literalmente se come el contenido por que excede el alto definido de ese elemento por el overflow, y algunas cajas que tienes, tienen un ancho que no es practico para poderlo apreciar (proyectos)

no lo tomes a mal, pero te aconsejo que lo vuelvas a hacer

te recomiendo que busques algun tutorial como Diseño responsive en 3 pasos, para que te des una idea de como deberia funcionar

tambien te dejo este "esqueleto" que hice hace bastante tiempo sobre la forma como interactúan los elementos al jugar con el ancho del navegador o al ser vistos desde un celular, no tiene nada de contenido, solo la pura estructura, pero te puede servir, para que te des una idea de como funciona el diseño liquido ;)
http://juangemelonet.zz.mu/Esqueleto/

en ese ejemplo, hay un div que representa un banner horizontal, y decidi no mostrarlo para dispositivos con una pantalla pequeña, ya que solo les estorbaría y no podrian tocarlo sin querer, generando una mala experiencia como usuarios.

espero que te sea de ayuda mi comentario amigo, cualquier cosa, comenta