2011-12-29 15 views
8

Eventuali duplicati:
Mobile Webkit reflow issueIOS non può fare clic sui collegamenti nel footer fisso fino a dopo lo scorrimento?

Ho cercato di capire questo. Ho un footer fisso su iOS con 4 collegamenti. Loro sono anche 6 link sotto di esso che non dovrebbero essere cliccabili poiché sono sotto. Tuttavia su iOS quando non si scorre la pagina prima i collegamenti sul footer fisso non funzionano e invece fa clic sul link sottostante. Dopo averlo fatto scorrere il più piccolo, funziona perfettamente. Spero di averlo spiegato abbastanza chiaramente.

È possibile vedere un esempio di qui:
amstar.m77950.com
(vista su iPhone)

ho cercato di applicare z-index per praticamente ogni elemento della pagina per vedere se ci era una soluzione. Ho anche usato jquery per assicurarmi che lo z-index fosse applicato su Load (anche se avrebbe dovuto essere comunque).

Tuttavia, non riesco ancora a far funzionare i collegamenti nel piè di pagina fino a quando non si scorre la pagina.

Qualsiasi aiuto su questo è molto apprezzato. Grazie.

Ecco il css Mi candido all'elemento:

problemi
.alertsBarClass { 
background: url("dynamicimage.aspx?id=21844") no-repeat scroll 0 0 #EA7E25; 
border-bottom: medium none; 
bottom: 0; 
display: block; 
position: fixed; 
width: 100%; 
z-index: 1000; 
} 
+0

Hai provato l'applicazione di un altezza esplicito al bar? – canon

+0

Sì, l'ho provato ancora senza fortuna. Grazie per la tua indicazione, comunque. – busyPixels

+0

Solo IOS5 e versioni successive supportano la posizione: proprietà fissa. –

risposta

1

Non ci sono noti con position: fixed in iOS 5.1 e ancore/link e scorrimento. Vedere il seguente bug # 10301184, n. 10810232.

Una cosa che può aiutare ... a volte ... è mettere il cursore: puntatore nelle div che circondano i tuoi collegamenti.

+0

Avevo gli stessi problemi, ma aggiungendo il cursore: il puntatore risolveva il problema ... per qualche motivo. Questa è una soluzione davvero strana. Sono stato in grado di applicare questo a tutta l'intestazione della mia pagina (i collegamenti stessi sono un bambino di 5-6 livelli di profondità). Poiché per i dispositivi mobili lo stile del cursore probabilmente non sarà evidente. –

+0

Probabilmente il problema non era quello a cui mi riferivo qui.Questo è un bug noto che NON viene corretto aggiungendo il cursore: pointer. Sui collegamenti iPad o iPhone (dispositivi touch) ottieni gli eventi touch, tuttavia altre cose come le div in cui usi jQuery per collegare i gestori di clic NON otterranno gli eventi touch a meno che tu non dica a iOS che è tangibile aggiungendo il cursore: pointer. Con quello là dentro otterrai eventi tattili. –

0

Aveva lo stesso problema. Risolto il problema scorrendo verso l'alto e verso il basso sul cambio di orientamento usando javascript.

ho aggiunto il seguente script per ogni pagina, la sua brutta ma funziona:

<script type=\"application/x-javascript\"> 
    addEventListener('load', function() { setTimeout(orientationChange, 0);}, false); 
    var currentWidth = 0; 
    function orientationChange() 
    { 
     if (window.innerWidth != currentWidth) 
     { 
      currentWidth = window.innerWidth; 
      var orient = (currentWidth == 320) ? \"profile\" : \"landscape\"; 
      window.scrollTo(0, 0); 
      setTimeout(function() {window.scrollTo(0, 1); }, 250); 
      document.body.setAttribute('orient', orient);    
     }   
    } 

    setInterval(orientationChange, 400);   
</script> 
Problemi correlati