我有关于iPad缩放的问题。
点击后,用户应该会看到一个带有叠加层的弹出窗口,并且视图不应缩放 - 这意味着它应缩小到0.75(基本上可以缩小缩小范围)。因此,我将此jQuery代码应用于视口:
$('meta[name="viewport"]').attr('content', 'width=1020, height=device-height, initial-scale=0.75, minimum-scale=0.75, maximum-scale=0.75, user-scalable=no');
在关闭时,我也将原始值重置为启用缩放。像这样:
$('meta[name="viewport"]').attr('content', 'width=1020');
所以要重申:
这可以正常工作,直到用户在第一个视口更改后执行一次缩放操作,并再次触发弹出事件。然后应用的视口属性不会生效,它将保持放大而不是缩放0.75。
TLDR:视口缩小仅适用一次:)
附加更多代码:
$('body').on('click', '#large-image', function() {
$('meta[name="viewport"]').attr('content', 'width=1020, height=device-height, initial-scale=0.75, minimum-scale=0.75, maximum-scale=0.75, user-scalable=no');
// HERE GOES CODE THAT CREATES A FIXED DIV WITH 100% IN BOTH HEIGHT AND WIDTH
});
$('body').on('click', '#zoomPinchClose', function() {
// REMOVE THE FIXED DIV
$('meta[name="viewport"]').attr('content', 'width=1020');
});
基本上就是这样。没有造型的身体。只创建一个拉伸的固定div。
答案 0 :(得分:0)
抓住稻草,但试试这个
$('body').on('click', '#zoomPinchClose', function() {
// REMOVE THE FIXED DIV
$('meta[name="viewport"]').removeAttr("content");
$('meta[name="viewport"]').attr('content', 'width=1020');
});