私は私たちのサイトでjqueryベースのライトボックスを実行していますが、すべてが主要なデスクトップOSブラウザーで正常に機能しています。
しかし、モバイルSafari(iPhoneとiPadの両方)(そしておそらくAndroidデバイスでも)では、これらのブラウザーのスケーリング機能が原因で問題が発生します。
これは、オーバーレイ要素を挿入し、そのオーバーレイの上にいくつかの画像を表示する「通常の」ライトボックスです。
これが私がやろうとしていることです:ウィンドウ全体をカバーしたいので、オーバーレイを取得してそれらの値に設定します$(window).width()
。$(window).height()
通常のデスクトップブラウザではスケーリングされないため問題ありませんが、スケーリングデバイスでは、これらの値が768x946であり、デスクトップ上のページの実際の幅が1400を超えるため、オーバーレイが狭すぎたり短すぎたりします。 。
はい、スケーリングをオフにすることはできますが、サイトは細かく縮小されているように見えるので、それを避けたいと思います。
したがって、質問は次のようになります。ページが縮小されたときに、ウィンドウまたは本体要素の実際の拡大縮小されていない幅をどのように取得しますか?
よろしくお願いします:-)マーティン