Javascript jquery水平动画在ipad和平板电脑上失败

我很难让jquery与ipad或其他平板电脑配合使用。应该有一个水平动画。当点击左边和右边的紫色按钮时，平板电脑上会发生可怕的重新缩放

“我的视口”设置为1200

这是我的jquery。当动画水平插入内容并逐渐消失时，ipad会重新缩放几分钟，然后重新显示出来

<script>
jQuery(document).ready(function($) {

$('.link').click(function() {
    $('#page').css('display','block');
    $('#page').animate({'left':'0px'}, 600);
    //$('#page2').animate({'left':'11400px'}, 600);
    //$('#page3').animate({'right':'-11400px'}, 600);
    $('#page3').hide(100);
    $('#page2').hide(100);
    $('#page2').animate({'left':'1090px'}, 600);
});

$('.link2').click(function() {
    //$('#page').hide(100);

    //$('#page3').css('display','block');
    $('#page3').show();
    $('#page3').animate({'left':'0px'}, 600);

    $('#page').hide(100);
    $('#page2').hide(100);
    $('#page2').animate({'left':'-1090px'}, 600);
    //$('#page2').hide(100);
    //$('#page2').animate({'left':'-1000px'}, 600);
});

$('.link-back').click(function() {
  $('#page').hide(100);    
    $('#page3').hide(100);
    $('#page2').css('display','block');
    $('#page2').animate({'left':'0px'}, 600);
    $('#page').animate({'left':'-1090px'}, 600);    
    $('#page3').animate({'left':'1090px'}, 600);    
});

});
</script>

解决方案如下：

<meta name="viewport" content="width=1200, initial-scale=1, maximum-scale=1">

---

需要保持比例不变，并需要修正打字错误

你能发一个链接到小提琴或演示网站，这样我们就可以更好地看到它应该是什么样子吗？

<meta name="viewport" content="width=1200, initial-scale=1, maximum-scale=1">