実現したいこと
ブラウザの描画領域の高さをjavascriptで取得して処理を実行したい
発生している問題
instagramのアプリ内ブラウザでのみ、
javascriptによって高さを取得すると実際より大きくなる。
多分、スクロールによって出たり消えたりする下部メニューの高さを考慮できていない。
縦スクロールバーも出る
前提
インスタグラム内ブラウザ以外のブラウザでは縦スクロールバーは出ないし
描画領域の高さも正常に取得できる
インスタグラム内ブラウザで正しい高さが取得できなかったソースコード
javascript
1alert(document.documentElement.clientHeight); 2alert(window.innerHeight); 3alert($("body").outerHeight());
試したこと
googleで調べてjsをいじる(前述の3通りに加えて、
縦スクロールバーが出ることを生かして
ページ最下部に移動しそのスクロール量から高さを算出しようとするも、
飛んだあとの座標が実際とはかけ離れており、断念。)
https://takumi0125.github.io/viewportChecker/
をインスタで開く→画面より縦に伸びてはみ出る(LINEのwebviewでははみ出ない)
https://stackoverflow.com/questions/45697919/any-workaround-on-instagram-in-app-browser-cropping
はif文にマッチしたあとの処理が不明で断念
https://ja.coder.work/so/javascript/526299
は「view is not defined」というエラーで失敗
補足情報(FW/ツールのバージョンなど)
iphone safari 604.1
iphone instagram 148.0
あなたの回答
tips
プレビュー