Detecta si el navegador móvil admite desbordamiento: scroll

¿Existe una solución de JavaScript simple para esto que sea independiente del dispositivo y la biblioteca?Detecta si el navegador móvil admite desbordamiento: scroll

Me gustaría agregar una clase al elemento html para que pueda entregar contenedores desplazables al dispositivo móvil cuando sea posible.

Este sería un enfoque similar que toma Modernizr, detectando el soporte de características en lugar de la detección del navegador. Simplemente no quiero usar todo el framework de Modernizr. Tratando de mantener la luz JavaScript para un proyecto móvil.

Gracias!

Fuente

2012-03-15 ackernaut

favor ponga un poco de esfuerzo en su pregunta, – Triode

Posible duplicado: http://stackoverflow.com/questions/3343311/can-javascript-detect-when-scrollbars-are-unavailable-ie-on-mobile-browsers. También vea: http://lostmonocle.com/post/870842095/geeky-stuff-using-jquery-to-check-if-scrollbars-are – Prescott

Estaba pensando algo más así, pero teniendo problemas para encontrarlo: http://stackoverflow.com/questions/3911866/how-to-detect-lack-of-positionfixed-in-a-generic-way – ackernaut

No es perfecto pero estoy usando esto para detectar -webkit-overflow-scrolling.

var overflowScrolling = typeof($("body")[0].style["-webkit-overflow-scrolling"]) !== "undefined";

Entonces me dicen si no overflow-scrolling y móvil, entonces me carga iScroll.

Significa que los dispositivos que admiten overflow: scroll pero no -webkit-overflow-scrolling todavía cargarán iScroll, pero esto al menos le ofrece desplazamiento nativo a iOS 5 y Android moderno.

Fuente

2012-06-02 11:50:05 respectTheCode

es probable que desee reemplazar el guión con un guión bajo? – donquixote

Esto comprueba el soporte para '-webkit-overflow-scrolling', no si' overflow: scroll' funciona en el navegador. – speedarius

@speedarius eso es lo que dice la primera oración. – respectTheCode

he aquí una solución que comprueba todas las opciones posibles, incluyendo las propiedades prefijadas no proveedores y no tiene dependencias en las bibliotecas como jQuery o Modernizr:

function hasOverflowScrolling() { 
    var prefixes = ['webkit', 'moz', 'o', 'ms']; 
    var div = document.createElement('div'); 
    var body = document.getElementsByTagName('body')[0]; 
    var hasIt = false; 

    body.appendChild(div); 

    for (var i = 0; i < prefixes.length; i++) { 
     var prefix = prefixes[i]; 
     div.style[prefix + 'OverflowScrolling'] = 'touch'; 
    } 

    // And the non-prefixed property 
    div.style.overflowScrolling = 'touch'; 

    // Now check the properties 
    var computedStyle = window.getComputedStyle(div); 

    // First non-prefixed 
    hasIt = !!computedStyle.overflowScrolling; 

    // Now prefixed... 
    for (var i = 0; i < prefixes.length; i++) { 
     var prefix = prefixes[i]; 
     if (!!computedStyle[prefix + 'OverflowScrolling']) { 
      hasIt = true; 
      break; 
     } 
    } 

    // Cleanup old div elements 
    div.parentNode.removeChild(div); 

    return hasIt; 
} 

alert(hasOverflowScrolling());

Fuente

2012-11-07 16:21:41 Husky

Esto comprueba la compatibilidad con el navegador para '- * - overflow-scrolling', que controla el" impulso "de desplazamiento en dispositivos móviles. No verifica si 'overflow: scroll' funciona en el navegador. Por ejemplo, en Android <3.0, 'overflow: scroll' simplemente no funciona. Creo que de eso se trata la pregunta. – speedarius

Esto me da siempre falso en todas partes – Gino

Esta es una muy buena pregunta. Desafortunadamente, actualmente parece que no hay forma de verificar confiablemente el soporte de overflow: scroll.

de grupos de filamentos tiene un polyfill para este, que es posible que desee utilizar en sus proyectos (ver http://filamentgroup.github.io/Overthrow/), pero de acuerdo a si mismos:

El problema es que es difícil - quizá imposible - para la prueba de desbordamiento apoyo [...]

por necesidad, derrocamiento examina la cadena de agente de usuario la lista blanca las versiones actuales y futuras de los teléfonos plataformas que se sabe que tienen el apoyo de desbordamiento nativa, pero no antes de comprobar a través de más medio fiable y agnósticos: a saber, IOS5 de (! y ahora de Chrome para Android también) tocar el desplazamiento propiedad CSS, y una prueba de inferencia amplio navegador de escritorio (no hay soporte de eventos táctiles con una pantalla mayor de 1200 píxeles de ancho)

Fuente

2013-08-26 13:37:00 Grodriguez

Detecta si el navegador móvil admite desbordamiento: scroll

Respuesta

Cuestiones relacionadas