1

If "Desktop site" not checked, this code working fine:

$('#formUploader').on('change', function(e) {
    e.preventDefault();
    var viewport = document.querySelector('meta[name="viewport"]');
    if (viewport) {
        viewport.content = 'initial-scale=1';
        viewport.content = 'width=device-width';
    }
...
}

But if checked, this code ignored.

Need zoom out mobile device screen, if zoomed in and if "Desktop site" checked.

This manipulation need only for centering #imgDivLoading on the mobile device screen, at anytime, zoomed in or out:

        xhr.upload.addEventListener("progress", function(e) {
            if (e.lengthComputable) {
                var uploadpercent = e.loaded / e.total;
                uploadpercent = Math.round(uploadpercent * 100);
                $("#imgDivLoading").css("visibility", "visible");
                $('.imgPercent').html(uploadpercent + '%');
                if (uploadpercent == 100) {
                    $('#imgDivLoading').css('background-image', 'url(/imgur/src/maintenance.gif)');
                    $('.imgPercent').html('Processing');
                }
            }
        }, false);

CSS:
#imgDivLoading {
    display: flex;
    position: fixed;
    z-index: 100;
    background-image: url("/imgur/src/loadingscreen.gif");
    background-color: rgba(242, 254, 254, 0.7);
    background-repeat: no-repeat;
    background-position: center;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    visibility: hidden;
        background-size: 250px 250px;
}

Not for responsive site

Erekle M.
  • 105
  • 8
  • 1
    my two cents: 1) you should never attempt to override user settings like that 2) if you design a responsive site and a user deliberately breaks the layout, why try to "fix" it? what's the point? – Chris G Dec 02 '20 at 10:24
  • Edited post, added more info and code. – Erekle M. Dec 02 '20 at 10:35
  • Here's an answer that details what a mess detecting this is: https://stackoverflow.com/a/5078596/5734311 – Chris G Dec 02 '20 at 11:17

0 Answers0