jquery mobile min-height after input file camera

Question

I have a problem with jQuery Mobile 1.3.1 with an input file (accept="image/*;capture=camera") and iOS.

When I click on the button to select a file or to take a picture (choose take picture), then I switch the device in landscape mode to actually take the picture and switch to portrait to confirm. After that, the page is cut at the top. I have to switch the device orientation to solve de problem. I saw that the min-height is 20px smaller just after selecting the file.

Does anyone know how to solve this problem ?

Or can I force jQuery mobile to recalculate the page dimension after file selection ?

You can see the problem here : http://www.reestcompany.com/jqmtest/test.html

You have to add the site to the home screen to have the web app mode and see the problem.

Thanks for you help

Answer 1

I posted an issue on jQuery mobile Github, but it is not a problem from jQuery mobile, it is a problem from Apple. So I also reported the bug to Apple.

https://github.com/jquery/jquery-mobile/issues/6138#issuecomment-20572130

Answer 2

You can use trigger page create to create the

$('#pagi-id').trigger('updatelayout');

As mentioned in the jqm docs

Example,

$(window).on( "orientationchange", function(event) {
      $('#pagi-id').trigger('updatelayout');
});