ipadのviewportって厄介？

viewportって、画面幅表示、最大拡大率2倍にしてるけど、

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scalable=yes">

これだとipadでうまくいかなかった！

縦表示から横表示に傾けると、コンテンツが画面をはみ出てしまった。

initial-scale=1.0をとるとうまくいくけど、

それだとスマホで、画面を横に向けた時の、文字サイズが大きすぎて、

すごく気になる！

ということで、ipadのときだけ、initial-scaleの指定を取ることにしたけど・・・・

    var ua = navigator.userAgent;
    var tabletFlg = (ua.indexOf('Android') > 0 && ua.indexOf('Mobile') == -1) || ua.indexOf('iPad') > 0;

    if(tabletFlg){
        $('head').children('meta[name="viewport"]').attr('content','width=device-width, maximum-scale=2.0, user-scalable=yes');
    }

PC表示をそのままスマホでも表示させたいときにも同じだった。

initial-scale=1.0入れてると、はみ出て一部しか見れない状態になっちゃいました。