Jak mogę zresetować powiększenie po przesłaniu formularza w mobilnym Safari, zachowując jednocześnie skalowalność użytkownika?

Question

Gdy użytkownik loguje się do mojej aplikacji z iPhone'a/iPada, Safari (pomocny) powiększa się, gdy użytkownik wypełnia pola nazwy użytkownika/hasła. Kiedy jednak formularz zostanie przesłany, a my go zalogujemy, nie przeładujemy strony (jest to jedna aplikacja strony), więc zoom nigdy się nie resetuje. Aplikacja jest zawsze uruchamiana w powiększonej skali.

Przyjrzałem się Jeremy Keith's solution, która z powodzeniem resetuje zoom, ale także uniemożliwia przyszłe skalowanie/powiększanie przez użytkownika, ponieważ ustawia on maximum-scale widoku.

Jak to:

var viewportmeta = document.querySelector('meta[name="viewport"]'); 

if (viewportmeta) { 
    viewportmeta.content = 'width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0'; 
} 

Czy ktoś widział piękny rozwiązanie resetowanie to po przedłożeniu formularza, bez zamarznięcie rzutnię potem?

Answer 1

To, co znalazłem w pracy, jest trochę hacky, ale wydaje się skuteczne. Zasadniczo przy składaniu formularza ustawiam maximum-scale, a następnie natychmiast go usuwam. Mam nadzieję, że to pomaga komuś.

element.on('submit', function(event) { 
    if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) { 
     var viewportmeta = document.querySelector('meta[name="viewport"]'); 
     if (viewportmeta) { 
     viewportmeta.setAttribute('content', 'width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0'); 
     viewportmeta.setAttribute('content', 'width=device-width, minimum-scale=1.0, initial-scale=1.0'); 
     } 
    } 
}