2012-04-02 19 views
8

Sto cercando di trovare uno script che rilevi se un dispositivo pone gli elementi position: fixed relativi a ViewPort e non all'intero documento.Rilevamento delle funzioni per posizione: fisso

Attualmente, i browser desktop standard e Mobile Safari (per iOS 5) lo fanno, mentre i dispositivi Android posizionano gli elementi fissi relativi all'intero documento.

ho trovato un paio di test per rilevare questo, ma nessuno dei sembra funzionare:

Qualcuno sa dove trovare/come scrivere un test che rileva in realtà che? Non voglio fare affidamento sullo sniffing del browser.

risposta

9

Secondo i contributori allo Modernizr, non è possibile farlo senza rilevare il browser in uso. I contributori sono abbastanza consolidati nel campo.

I test per position: fixed su dispositivi iOS e Android sono elencati sotto lo Undetectables wiki page nel progetto Modernizr.

Il MobileHTML5 website elenca il supporto per position:fixed. http://mobilehtml5.org/

+0

Questo è triste ... ma molte grazie per i riferimenti! –

5

In realtà, i ragazzi del gruppo Filament hanno fatto una cosa intelligente con il loro Fixedfixed mettendo la stringa di user-agent di falsi positivi noti nel loro test.

Controllare esso @http://github.com/filamentgroup/fixed-fixed

Qualcuno potrebbe completarlo con alcuni falsi negativi troppo, e ne fanno un test di Modernizr adizionale featur.

1

Ho creato un altro controllo se position:fixed è davvero supportato nel browser. Crea un div fisso e prova a scorrere e controlla se la posizione di div è cambiata.

function isPositionFixedSupported(){ 
    var el = jQuery("<div id='fixed_test' style='position:fixed;top:1px;width:1px;height:1px;'></div>"); 
    el.appendTo("body"); 

    var prevScrollTop = jQuery(document).scrollTop(); 
    var expectedResult = 1+prevScrollTop; 
    var scrollChanged = false; 

    //simulate scrolling 
    if (prevScrollTop === 0) { 
     window.scrollTo(0, 1); 
     expectedResult = 2; 
     scrollChanged = true; 
    } 

    //check position of div 
    suppoorted = (el.offset().top === expectedResult); 

    if (scrollChanged) { 
     window.scrollTo(0, prevScrollTop); 
    } 

    el.remove(); 

    return suppoorted; 
} 

Questa funzione è stata testata in Firefox 22, Chrome 28, IE 7-10, Android Browser 2.3.

Problemi correlati