2012-05-12 13 views
4

私は、ウェブサイトの真の寸法は、iPhone(ポートレートモード)でそう480PXにビューポートのタグを設定します。iPhone(jQuery)の高さが間違っていますか?

  1. 480x534pxトップバーが しかし

に隠されているとき、トップバーは480x594px

  • 表示されているとき jQuery(window).height()window.innerHeightjQuery(window).InnerHeight()いつも480x534pxを返し、現在のコンテンツ(ポップアップウィンドウ)の上に height: 100%; width: 100%;コンテナを配置しようとすると、ウェブサイトの最下部に60pxのギャップを作成します。

    これは既にjQueryバグ(とiPhoneのバグ)として報告されていますが、回避策はありますか?

    +0

    同様の質問に対する私の答えをチェック、少し助けるかもしれないhttp://stackoverflow.com/questions/8205812/jquery-js-ios-4-and-document-height-problems –

    +0

    @DmitrySemenovありがとう!私はこれを1年前に行う方法を見つけました。これをjQueryのバグとして報告しました。彼らはこれがjQuery 1.8で修正されるべきだと言いました(今はjQuery 1.9があるので、修正されているかもしれません)。 iOSのアップグレード(最近の6.0)の後にも大きな変更がありますので、定期的にスクリプトやライブラリ/プラグインを更新する必要があります:) – Atadj

    答えて

    1

    iPhoneにページが読み込まれると、トップバーが表示されます。
    です。そのため、$(window).height()は、より小さいウィンドウの実際のサイズを返します。上部バーがスライドしてウィンドウサイズが変わるとしばらくしてから、

    上部のバーサイズを表す(window).height()に定数を追加するか、上部パネルが消えた後に実際のサイズを取得するhook up$(window).resize()イベントを追加することができます。

    +0

    同じ前後で高さを取得します(間違った)値:window.addEventListener( "load"、function(){ window.scrollTo(0、1); }); – Atadj

    1

    必ず内側の高さの代わりに外側の高さを使用してください。あなたは次のように、プレーンなJavaScriptでそれをしなければならないので、残念ながら、jQueryの$(window).outerHeight()ウィンドウ(それは$(window).height()と同じを返す)と文書要素には適用されません。

    (typeof window.outerHeight != 'undefined')?Math.max(window.outerHeight, $(window).height()):$(window).height() 
    
    関連する問題