Problems with jqueryui dialog when increasing size of iOS / iphone / ipad

Question

I have a jqueryui dialog that works fine except when it scales on an iOS device. When the user starts to open a dialog box, he deviates from the screen. This does not happen if the user does not scale. What can be done to fix this?

$('#white_box_content_'+id).dialog({ autoOpen: false, modal:true, position:"center", closeText:'', resizable:false, title:null, draggable:false, //dialogClass:'jquery_dialog_position', zIndex:800 }); $('#white_box_content_'+id).dialog('open'); $('.ui-widget-overlay').css( "position" , 'fixed' ); $(".ui-dialog-titlebar").remove(); $('#white_box_content_'+id).dialog( "option" , 'position' , 'center' ); 

Answer 1

You can not. Position: fixed makes the layout based on the viewport. The problem is that in iOS scaling on the page does not change the viewing area. You cannot determine when the user zooms in on the page. You can use CSS and meta tags to “disable” scaling on iOS devices.