2012-04-16 8 views
2

orientationchangeで画面の幅を計算する必要があります。Jquery/JavascriptのorientationchangeイベントでAndroid上でページ幅を取得する方法は?

私はこのようにそれをやっている:

$(window).on('orientationchange', function(event){ 
    $(this).panelWidth("orientationchange") 
    }); 

panelWidth: function (fromWhere) { 
    window.setTimeout(function() { 
     var $wrapWidth = $('div:jqmData(wrapper="true").ui-page-active').innerWidth(); 
     console.log($wrapWidth); 
     },10); 
    }); 

私はすでに画面の幅を計算するために10msの遅延を使用していますが、Android上で、それはまだ動作しません...

マイスクリーンがあります320x480私が肖像画から始め、風景に変えたら、私は320pxになります。私が肖像画に戻ったとき、私は480pxを操作するので、実際には向きが変わる前に常に幅が計算されているようです。

できるだけタイムアウトを増やしたくありません。他の方法は、$ wrapWidthがAndroidが画面を "回転"させたときにのみ計算されることを確認することですか?

ありがとうございました!

EDIT
jqueryのモバイルsourceodeからいくつかの情報:

...as the actual screen resize takes place before or after the orientation 
change event has been fired depending on implementation (eg android 2.3 is 
before, iphone after). More testing is required to determine if a more reliable 
method of determining the new screensize is possible when orientationchange 
is fired. (eg, use media queries + element + opacity) 

答えて

6

これはframwork Androidデバイスのバグです。あなたができることは2つあります。

  1. thisによれば、タイムアウトを100ミリ秒に変更します。どうやらそれは問題を解決するだろう。
  2. 発信元が変更される前にイベントが発生したため、幅と高さに反対の値を使用します。以下のような:(イベント場合

    $(ウィンドウ).bind( 'orientationchange'、機能(イベント){ 場合(event.orientation == '肖像'){// は他の風景 のためのあなたのページを}変更。 orientation == 'landscape'){ //ポートレートのページを変更する }
    });

+0

ああ。私は2番目の回避策が好きです。非常に素晴らしい!これを指摘してくれてありがとう! – frequent

+0

ok。私は、クロスデバイス(Android上だけでなく)で動作する解決策を得ました。私の答えを見る – frequent

関連する問題