Ver Mensaje Individual
  #6 (permalink)  
Antiguo 04/07/2013, 04:56
Pejigo
 
Fecha de Ingreso: febrero-2010
Mensajes: 49
Antigüedad: 14 años, 2 meses
Puntos: 0
Respuesta: Media queries, no aparece el scroll

Cita:
Iniciado por madman_18 Ver Mensaje
Sí, te entendí mal, perdona

En cuanto a lo que comentas:

- Si tu página está construida sobre php te recomentaría que buscases Mobile Detection (no recuerdo el enlace por eso no te lo pongo), que te da si se está visualizando sobre una tablet, un teléfono, pc....te sería útil a la hora de no cargar contenido para el móvil en vez de el display:none, que lo que te haría sería cargarlo pero no permitir que se vea.
Así podrías ver si realmente es ese carrusel de background lo que te hace que sobrecarge la página y no te permita funcionar correctamente.

- Los meta tendrías que poner estos:

Código HTML:
Ver original
  1. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  2.  <meta name="apple-mobile-web-app-capable" content="yes">
  3.  <meta name="apple-mobile-web-app-status-bar-style" content="black">

Para que te reconozca los estilos movil (supongo que ya lo tendrás puesto)....

Otra cosa que a mí me sirve cuando estoy atascado, es coger una página de prueba, hacerla con la estructura que yo quiero e ir montandola poco a poco (sin quebrarme los cascos con estilos etc etc) y ver si tengo un fallo en mi estructura o puede ser por otra cosa

Ya nos dices!
- Los meta que uso son estos;
Código HTML:
 <meta http-equiv="Content-type" content="application/xhtml+xml;charset=UTF-8" />
	<meta http-equiv="Cache-control" content="public"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
	<meta name="handheldfriendly" content="true"/> 
En los dos últimos que has puestos son exclusivos para dispositivos apple? el último de todos veo que es par que esconda las barras de la interfaz, no?

- Está construida sobre html, así que no se si tiene solución al estar cargadas las imágenes dentro de un div. Antes usaba otro carrusel que me las cargaba por javascript, supersized.
Ahí puede ser que se pueda hacer algo.

En cuanto que detecte si es un móvil creo que te puedes referir a algo como esto;
Código:
 var isMobile = function() {
   console.log("Navigator: " + navigator.userAgent);
   return /(iphone|ipod|ipad|android|blackberry|windows ce|palm|symbian)/i.test(navigator.userAgent);
 };
El problema es que esto es para detectar todos los dispositivos móviles y me gustaría que se viera la web completa en dispositivos con cierta resolución en los que estarían los tablets y la reducida en móviles con pantalla más pequeña.
A todo esto he llegado a la conclusión de si puede ser mejor opción crear una especifica para ese tipo de dispositivos por la usabilidad del sitio. He encontrado un menú acordeón super simple que me haría esa función, y en tan solo una página tendría toda la navegación del sitio, no como con la web completa que para navegar, te lleva a subpáginas y en esas ya tienes el contenido. Y así que estás galerías contengan fotos de menor resolución para una vez más no sobrecargar los dispositivos móviles.

He encontrado esto, y funciona en pruebas que he realizado
Código:
<script type="text/javascript">
<!--
if (screen.width <= 1000) {
document.location = "mobile";
}
//-->
</script>
Código:
 // crude way to check that the screen is at 1024x768
 if (window.screen.width < 1000) {
   // resolution is below 10 x 7
   window.location = 'm.mysite.com'; //for example
 }
Aunque no se que diferencia exactamente hay entre ambos.
Y no se si este script funcionaria en todo tipo de dispositivos, pero esto solucionaría el problema de detección por pixeles de ancho y no por tipo de dispositivo, si es android... IOS...

Lo he puesto en el apartado del foro correspondiente, ya que esto no es propiamente código CSS
http://www.forosdelweb.com/f13/redir...mobil-1062389/

A ver que te parece esto, siento que estoy a punto de solucionar el problema!
Gracias y un saludo