Is there a best practice for this?
Our app is an application form, so there's a series of views with forms that the user fills out and clicks a button to transition to the next view.
What's happening (at least with Chrome on my android, accessing the web app) is that Chrome zooms in while I'm filling out the form--which is helpful--but then it stays at that zoom when I go to the next view. I'd like it to reset to show the whole page.
I can think of two options:
Set
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
to prevent scaling at all. First, I haven't tested this yet to confirm that it will prevent the browser from helpfully zooming. Second, accessibility is very important to us, so I'm really not comfortable with this solution.Reset the zoom somehow (with javascript?) on view load? This seems hacky to me.
Recommendations?
I don't think it's anything about how I'm doing the view transition that's affecting this, but just in case: the button on the form is something like:
<button ng-click="save(sections, nextSection)" type="submit">
Next Step
</button>
and the save
method in the controller is:
$scope.save = function(sections, nextSection) {
applicationForm.set(sections);
$location.path(nextSection);
}
where nextSection
will be a string like "/questions/2"
.