首页 > 解决方案 > 单击时更改元视口内容

问题描述

我正在尝试更改单击时的视口内容,以便用户可以在将图像加载到模态时捏缩放图像,然后在模态关闭时将视口内容更改为正常。

//button to open the modal and change the viewport content 
$('#product-zoom').on('touchstart', function () {
                    console.log('found html')
                    $('meta[name=viewport]').remove();
                    $('head').append('<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=12, user-scalable=yes">');
            });
//button to close the modal and change the viewport
            $('.btnZoomerClose').on('click', function () {
                console.log('close modal')
                $('head').append('<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">');
            });

由于某种原因,关闭不会将视口恢复正常。

任何建议或信息都会很棒!

标签: jqueryhtmlcss

解决方案


您想将视口改回正常状态,但是在打开和关闭模式时为视口设置了相同的属性..您的意思是要返回

$('head').append('<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">');  

回到

$('meta[name=viewport]')


推荐阅读