javascript ヴューポート切り替え（スマホ横向き）

Posted 2021-05-03

//　デバイス毎にviewport切り替え

$(function(){
    // setViewport
    spView = 'width=device-width,initial-scale=1';
    tbView = 'width=1000px,maximum-scale=2.0,user-scalable=1';
 
    if(navigator.userAgent.indexOf('iPhone') > 0 || navigator.userAgent.indexOf('iPod') > 0 || (navigator.userAgent.indexOf('Android') > 0 && navigator.userAgent.indexOf('Mobile') > 0)){
        $('head').prepend('<meta name="viewport" content="' + spView + '" id="viewport">');
    } else if(navigator.userAgent.indexOf('iPad') > 0 || (navigator.userAgent.indexOf('Android') > 0 && navigator.userAgent.indexOf('Mobile') == -1) || navigator.userAgent.indexOf('A1_07') > 0 || navigator.userAgent.indexOf('SC-01C') > 0){
        $('head').prepend('<meta name="viewport" content="' + tbView + '" id="viewport">');
    } 
 
    // iPhone6 Plus Landscape Viewport
    if(navigator.userAgent.indexOf('iPhone') > 0){
        if(window.devicePixelRatio == 3) {
 
            if(window.orientation == 0){
                $('#viewport').attr('content',spView);
            } else {
                $('#viewport').attr('content',tbView);
            }
 
            window.onorientationchange = setView;
 
            function setView(){
                setTimeout(function(){
                    location.reload();
                    return false;
                },500);
            }
        }
    }
});