/ / scrollTo () con ipad y elemento fijo [duplicado] - jquery, ipad, fixed, scrollto

scrollTo () con ipad y elemento fijo [duplicado] - jquery, ipad, fixed, scrollto

Posible duplicado:
¿Error de Safari móvil en el botón de posición fija después de que scrollTop haya cambiado programáticamente ...?

Estamos tratando de poner una navegación fija para desplazar las diferentes secciones de una página.

Estamos usando jquery scrollTo ().

Solo en ipad, el primer clic pasa sin problema, pero después de este, la navegación parece estar deshabilitada. Si nos desplazamos, aunque sea un poco, con la mano, el enlace volverá a funcionar.

Aquí está el código: http://lacabaneprod.com/test/

¿Cómo puedo arreglar mi barra lateral?

Respuestas

2 para la respuesta № 1

Me encontré con el mismo problema hace unas semanas.

La razón por la que esto sucede es porque el "contenido"obtiene el foco, y al tocar la pantalla "toca" el contenido detrás de la barra lateral. Esto solo sucede si usa el complemento scrollTo o jquery.animate en la propiedad scrollTop.

Para solucionar esto, después de la animación scrollTo, reposicionamos la ventana.

$(window).scrollTop($(window).scrollTop() + 1);
$(window).scrollTop($(window).scrollTop() - 1);

Pero también tenga en cuenta que las posiciones fijas no son compatibles antes de iOS 5.


1 para la respuesta № 2

Para cualquiera que esté experimentando este problema usando el complemento LocalScroll de Ariel Flesler, la respuesta anterior de Arief funciona y se puede aplicar de la siguiente manera:

$(document).ready(function() {
$.localScroll.defaults.axis = "x";
$.localScroll({
target:"#content",
onAfter:function(){
var xPos = window.pageXOffset;
var $fixedElement = $("#menubar");
$fixedElement.css({ "position": "absolute" });
window.scroll(xPos,0);
$fixedElement.css({ "position": "fixed" });
}
});

});

En este caso, tengo un desplazamiento horizontalsitio web (por lo tanto, el valor predeterminado es el eje "x"; el suyo puede ser diferente). Estoy desplazando un div "#content" que está configurado como "overflow: hidden" (de ahí el "objetivo"). Y luego toda la magia de Arief está en "onAfter: function".

He ajustado esto para que en lugar de "ventana".scroll (0,0) "- que se desplaza hacia atrás hasta el comienzo de la página - obtiene la posición de desplazamiento de la ventana actual usando window.pageXOffset y establece una variable" xPos "para esto (nuevamente, si se desplaza en el Es posible que necesite usar window.pageYOffset también). Esta variable se usa en "window.scroll (xPos, 0)" - la mía es "0" en el eje y, ya que no estoy desplazándome en ese eje. Creo que puede haber diferentes formas de calcular la posición actual del desplazamiento, pero esto funcionó mejor para mí.

Inicialmente no pude hacer que esto funcionara cuando miEl elemento "overflow: hidden" era en realidad la etiqueta html, así que moví esto al div "#content" y funcionó bien. He estado probando en iPad 3, así que no sé qué tan compatible es.


0 para la respuesta № 3

Prueba este código, me funciona:

var $fixedElement = $("#nav"); // Replace this with your "fixed" element

$fixedElement.css({ "position": "relative" });
window.scroll(0, 0);
$fixedElement.css({ "position": "fixed" });